как установить заголовок и подзаголовок в нижней части панели приложений во флаттере

Я разрабатываю страницу входа в нее, я хотел показать свой заголовок и подзаголовок внизу панели приложения, но не нашел подходящего способа

я использовал этот код:

  @override
   Widget build(BuildContext context) {
   return Scaffold(
   appBar: PreferredSize(
   preferredSize: Size.fromHeight(150.0),
     child: AppBar(
        centerTitle: false,
        titleSpacing: 0.0,
        leading: IconButton(
          icon: Icon(Icons.arrow_back, color: Colors.black), onPressed: () {  },
          //onPressed: () => Navigator.of(context).pop(),
           ),  
       title: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          'LOGIN',
          style: TextStyle(color: Colors.black, fontSize: 16.0),
        ),
        Text(
          'Enter your email and passowrd',
          style: TextStyle(color: Colors.black, fontSize: 14.0),
        )
      ],
    ),
  ],
),

person BlackCoder    schedule 17.02.2021    source источник


Ответы (3)


Результат:

введите описание изображения здесь

Код:

Scaffold(
      appBar: PreferredSize(
        preferredSize: Size.fromHeight(150.0),
        child: AppBar(
          leading: IconButton(
            icon: Icon(Icons.arrow_back, color: Colors.black),
            onPressed: () {},
            //onPressed: () => Navigator.of(context).pop(),
          ),
          bottom: PreferredSize(
            preferredSize: Size.fromHeight(30.0),
            child: Container(
              alignment: Alignment.centerLeft,
              padding: EdgeInsets.symmetric(horizontal: 20),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    'LOGIN',
                    style: TextStyle(color: Colors.black, fontSize: 16.0),
                  ),
                  Text(
                    'Enter your email and passowrd',
                    style: TextStyle(color: Colors.black, fontSize: 14.0),
                  )
                ],
              ),
            ),
          ),
        ),
      ),
    )
person Priyesh    schedule 17.02.2021
comment
просто отлично :) ‹3 - person BlackCoder; 17.02.2021
comment
Добро пожаловать! Продолжает расти - person Priyesh; 17.02.2021

может быть не лучшим решением, но будет работать.

return Scaffold(
    appBar: AppBar(
      elevation: 0.0,
      backgroundColor: Colors.grey[100],
    ),
    body: Column(
      children: [
        Container(
          color: Colors.grey[100],
          padding: EdgeInsets.only(left: 20,top: 150),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                'LOGIN',
                style: TextStyle(color: Colors.black, fontSize: 16.0),
              ),
              Text(
                'Enter your email and passowrd',
                style: TextStyle(color: Colors.black, fontSize: 14.0),
              )
            ],
          ),
        ),
        //over here add your rest of the body content
      ],
    ),
  );
person Deepak Lohmod    schedule 17.02.2021

Попробуйте использовать ответ здесь. Вы можете использовать свойство bottom класса AppBar и использовать там виджет PreferredSize.

person Preet Shah    schedule 17.02.2021