【问题标题】:Flutter remove extra space left and right of appbarFlutter 移除 appbar 左右多余的空间
【发布时间】:2022-07-22 14:49:53
【问题描述】:

所以我一直在尝试解决这个问题,但我不能在我的appbar 中有一个搜索框,我有一个PreferredSize 来帮助我的高度我有额外的空间,如蓝色所示下图中的线。有人可以帮助我如何删除这个类似填充的空间,因为我希望内容与搜索框下方的内容对齐?下面是截图和我的代码sn-p。


   appBar: PreferredSize(
          preferredSize: Size.fromHeight(40.0),
          // here the desired height
          child: AppBar(
            centerTitle: true,
            backgroundColor: colorGreen,
            title: Container(
              height: 35,
                width: double.infinity,
                decoration: BoxDecoration(
                  color: Colors.white,
                   ),
                child: Center(
                    child: SizedBox(
                      height: 40,
                      width: double.infinity,
                      child: Row(
                        children: <Widget>[
                          // Expanded(
                          Container(
                            padding: EdgeInsets.only(bottom:6),
                              width: 240,
                                alignment: Alignment.centerLeft,
                                child: TextField(
                                  readOnly: true,

                                  onTap: (){
                        


                                  },
                                  textAlign: TextAlign.left,
                                  controller: controller,
                                  cursorColor: Colors.grey,
                                  style: TextStyle(
                                      color: Colors.grey,
                                      fontSize: 16,
                                      fontFamily: 'Montserrat'),
                                  onChanged:
                                  onSearchTextChanged,
                                  decoration: InputDecoration(
                                    hintText: "Search",
                                    hintStyle: TextStyle(
                                        color: Colors.grey,
                                        fontSize: 13,fontWeight: FontWeight.normal,
                                        fontFamily:
                                        'Montserrat'),
                                    border: InputBorder.none,
                                    prefixIcon: Container(
                                        padding: EdgeInsets.only(top: 5),
                                        child:Icon(
                                      Icons.search,
                                      color: Colors.grey,
                                      size: 15,
                                    )),

                                    suffixIcon: Visibility(
                                        visible: backClear,
                                        child:InkWell(
                                        onTap: () {
                                          },
                                        child: Container(
                                            padding: EdgeInsets.only(top: 5),
                                            child:Icon(
                                          Icons.backspace,
                                          color: Colors.grey,
                                          size: 12,
                                        )))),
                                   labelStyle: TextStyle(
                                       color: Colors.grey,
                                       fontSize: 14,fontWeight: FontWeight.normal,
                                       fontFamily:
                                       'Montserrat'),
                                   // hintText:Center(child: Text(""),), //contentPadding: EdgeInsets.only(top: 2),
                                  ),
                                ),
                              ),


                          new Container(
                            width: 2.0,
                            height: 100.0,
                            color: colorGreen,
                          ),
                          Expanded(
                              flex: 1,
                              child: Align(
                                alignment: Alignment.center,
                                child: new Theme(
                                    data: Theme.of(context)
                                        .copyWith(
                                      canvasColor:colorGray,
                                    ),
                                    child:Directionality(
                                        textDirection: TextDirection.ltr,
                                        child: DropdownButtonHideUnderline(
                                      child: ButtonTheme(
                                        alignedDropdown: true,
                                        child: DropdownButton(
                                          //iconSize: 15,
                                          isDense: false,
                                          icon: Container(
                                              padding: EdgeInsets.all(0),
                                              child:Icon(
                                            //Icons.arrow_drop_down,
                                            Icons.location_on,
                                            color: Colors.grey,
                                            size: 15,
                                          )),

                                          hint: Center(
                                              child: Text(
                                                "All Cities",
                                                textAlign: TextAlign
                                                    .center,
                                                style: TextStyle(
                                                    color: Colors
                                                        .grey,
                                                    fontWeight:
                                                    FontWeight
                                                        .normal,
                                                    fontFamily:
                                                    'Montserrat',
                                                    fontSize: 12),
                                              )),
                                          style: TextStyle(
                                            color: Colors
                                            .grey,
                                            fontWeight:
                                            FontWeight
                                                .normal,
                                            fontFamily:
                                            'Montserrat',
                                            fontSize: 12),
                                          //value: selectedCountry,
                                          onChanged: (newVal) {
                                            setState(() {
                                                 });
                                          },
                                          value: _mySelection,
                                          items:
                                          data.map((item) {
                                            return new DropdownMenuItem(
                                              child: Container(
                                                child: Container(
                                                    padding: EdgeInsets.all(0),
                                                    child: Center(
                                                    child: Text(
                                                  ""
                                                ))),
                                              ),
                                              value: item['id']
                                                  .toString(),
                                            );
                                          }).toList(),

                                          isExpanded: true,
                                        ),
                                      ),
                                    )
                                    ),
                              )
                              ),
                          )
                        ],
                      ),
                    ))),

          ),
        ),



【问题讨论】:

    标签: flutter appbar


    【解决方案1】:

    将中心标题设为假

    centerTitle:假,

    appBar: PreferredSize(
          preferredSize: Size.fromHeight(40.0),
          // here the desired height
          child: AppBar(
            centerTitle: true,
            backgroundColor: colorGreen,
            title: Container(
              height: 35,
                width: double.infinity,
                decoration: BoxDecoration(
                  color: Colors.white,
                   ),
                child: Center(
                    child: SizedBox(
                      height: 40,
                      width: double.infinity,
                      child: Row(
                        children: <Widget>[
                          // Expanded(
                          Container(
                            padding: EdgeInsets.only(bottom:6),
                              width: 240,
                                alignment: Alignment.centerLeft,
                                child: TextField(
                                  readOnly: true,
    
                                  onTap: (){
                        
    
    
                                  },
                                  textAlign: TextAlign.left,
                                  controller: controller,
                                  cursorColor: Colors.grey,
                                  style: TextStyle(
                                      color: Colors.grey,
                                      fontSize: 16,
                                      fontFamily: 'Montserrat'),
                                  onChanged:
                                  onSearchTextChanged,
                                  decoration: InputDecoration(
                                    hintText: "Search",
                                    hintStyle: TextStyle(
                                        color: Colors.grey,
                                        fontSize: 13,fontWeight: FontWeight.normal,
                                        fontFamily:
                                        'Montserrat'),
                                    border: InputBorder.none,
                                    prefixIcon: Container(
                                        padding: EdgeInsets.only(top: 5),
                                        child:Icon(
                                      Icons.search,
                                      color: Colors.grey,
                                      size: 15,
                                    )),
    
                                    suffixIcon: Visibility(
                                        visible: backClear,
                                        child:InkWell(
                                        onTap: () {
                                          },
                                        child: Container(
                                            padding: EdgeInsets.only(top: 5),
                                            child:Icon(
                                          Icons.backspace,
                                          color: Colors.grey,
                                          size: 12,
                                        )))),
                                   labelStyle: TextStyle(
                                       color: Colors.grey,
                                       fontSize: 14,fontWeight: FontWeight.normal,
                                       fontFamily:
                                       'Montserrat'),
                                   // hintText:Center(child: Text(""),), //contentPadding: EdgeInsets.only(top: 2),
                                  ),
                                ),
                              ),
    
    
                          new Container(
                            width: 2.0,
                            height: 100.0,
                            color: colorGreen,
                          ),
                          Expanded(
                              flex: 1,
                              child: Align(
                                alignment: Alignment.center,
                                child: new Theme(
                                    data: Theme.of(context)
                                        .copyWith(
                                      canvasColor:colorGray,
                                    ),
                                    child:Directionality(
                                        textDirection: TextDirection.ltr,
                                        child: DropdownButtonHideUnderline(
                                      child: ButtonTheme(
                                        alignedDropdown: true,
                                        child: DropdownButton(
                                          //iconSize: 15,
                                          isDense: false,
                                          icon: Container(
                                              padding: EdgeInsets.all(0),
                                              child:Icon(
                                            //Icons.arrow_drop_down,
                                            Icons.location_on,
                                            color: Colors.grey,
                                            size: 15,
                                          )),
    
                                          hint: Center(
                                              child: Text(
                                                "All Cities",
                                                textAlign: TextAlign
                                                    .center,
                                                style: TextStyle(
                                                    color: Colors
                                                        .grey,
                                                    fontWeight:
                                                    FontWeight
                                                        .normal,
                                                    fontFamily:
                                                    'Montserrat',
                                                    fontSize: 12),
                                              )),
                                          style: TextStyle(
                                            color: Colors
                                            .grey,
                                            fontWeight:
                                            FontWeight
                                                .normal,
                                            fontFamily:
                                            'Montserrat',
                                            fontSize: 12),
                                          //value: selectedCountry,
                                          onChanged: (newVal) {
                                            setState(() {
                                                 });
                                          },
                                          value: _mySelection,
                                          items:
                                          data.map((item) {
                                            return new DropdownMenuItem(
                                              child: Container(
                                                child: Container(
                                                    padding: EdgeInsets.all(0),
                                                    child: Center(
                                                    child: Text(
                                                  ""
                                                ))),
                                              ),
                                              value: item['id']
                                                  .toString(),
                                            );
                                          }).toList(),
    
                                          isExpanded: true,
                                        ),
                                      ),
                                    )
                                    ),
                              )
                              ),
                          )
                        ],
                      ),
                    ))),
    
          ),
        ),
    

    【讨论】:

    • 我做了,空间还在
    猜你喜欢
    • 2021-11-03
    • 2019-10-15
    • 1970-01-01
    • 2011-08-31
    • 2011-05-26
    • 2020-11-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多