Методы создания страницы входа во Flutter с примерами кода

Ниже приведены несколько способов создания страницы входа с помощью Flutter, а также примеры кода:

Метод 1: использование виджетов Material Design Flutter

import 'package:flutter/material.dart';
class LoginPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Login Page'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('Login Form'),
            TextField(
              decoration: InputDecoration(
                labelText: 'Email',
              ),
            ),
            TextField(
              decoration: InputDecoration(
                labelText: 'Password',
              ),
              obscureText: true,
            ),
            RaisedButton(
              child: Text('Login'),
              onPressed: () {
                // Perform login logic here
              },
            ),
          ],
        ),
      ),
    );
  }
}

Метод 2: использование виджетов Flutter’s Cupertino Design (стиль iOS)

import 'package:flutter/cupertino.dart';
class LoginPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return CupertinoPageScaffold(
      navigationBar: CupertinoNavigationBar(
        middle: Text('Login Page'),
      ),
      child: SafeArea(
        child: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text('Login Form'),
              CupertinoTextField(
                placeholder: 'Email',
              ),
              CupertinoTextField(
                placeholder: 'Password',
                obscureText: true,
              ),
              CupertinoButton(
                child: Text('Login'),
                onPressed: () {
                  // Perform login logic here
                },
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Метод 3. Использование индивидуального дизайна

import 'package:flutter/material.dart';
class LoginPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Login Page'),
      ),
      body: Container(
        padding: EdgeInsets.all(16.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              'Login Form',
              style: TextStyle(
                fontSize: 24.0,
                fontWeight: FontWeight.bold,
              ),
            ),
            SizedBox(height: 16.0),
            TextFormField(
              decoration: InputDecoration(
                labelText: 'Email',
              ),
            ),
            SizedBox(height: 16.0),
            TextFormField(
              decoration: InputDecoration(
                labelText: 'Password',
              ),
              obscureText: true,
            ),
            SizedBox(height: 16.0),
            RaisedButton(
              child: Text('Login'),
              onPressed: () {
                // Perform login logic here
              },
            ),
          ],
        ),
      ),
    );
  }
}