0

i tried to reduce space between Rows(Textfields) with height proprety,but it doesn't work,Sizedbox didn't work as well,can't omit expanded widget because of my filterList(it shows“A RenderFlex overflowed by pixels ” error),i tried to fix it with flex Value but it doesn't work too. any Idea how can i fixt it?!

my emulator screenshot

import 'package:flutter/material.dart';
import 'package:filter_list/filter_list.dart';
class FilterPage extends StatefulWidget {
  const FilterPage({Key key, this.allTextList}) : super(key: key);
  final List<String> allTextList;
  @override
  _FilterPageState createState() => _FilterPageState();
}
class _FilterPageState extends State<FilterPage> {
  @override
  Widget build(BuildContext context) {
    List<String> countList = [
      "Art",
      "Mt",
      "P",
      "Pl"
   
    ];
    return Scaffold(
      appBar: AppBar(
        title: Text("Filter list Page"),
      ),
      body: SafeArea(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Expanded(
              child: FilterListWidget(
                allTextList: countList,
                height: MediaQuery.of(context).size.height,
                hideheaderText: true,
                selectedTextBackgroundColor: Colors.red,
                applyButonTextBackgroundColor: Colors.red,
                allResetButonColor: Colors.grey,
                onApplyButtonClick: (list) {
                  //Navigator.pop(context, list);
                },
              ),
            ),
            Expanded(
              child: Row(
                children: [
                  Container(
                    width: 180,
                    child: TexstInput(lable: 'min-Upvote',icons: Icons.favorite,),
                  ),
                  Container(
                    width: 180,
                    child: TexstInput(lable: 'max-Upvote'),
                  ),
                ],
              ),
            ),
            Expanded(
              child: Row(
                children: [
                  Container(
                    width: 180,
                    child: TexstInput(lable: 'min',icons: Icons.person_rounded,),
                  ),
                  Container(
                    width: 180,
                    child: TexstInput(lable: 'max'),
                  ),
                ],
              ),
            ),
            Container(
                child: RaisedButton(child:Text(
                  'apply'
                ),),
              ),
          ],
        ),
      ),
    );
  }
}
class TexstInput extends StatelessWidget {
   TexstInput({
@required this.lable,this.icons
  }) ;
   IconData icons;
   String lable;
  @override
  Widget build(BuildContext context) {
    return TextField(
      keyboardType: TextInputType.number,
      decoration: InputDecoration(
          icon: Icon(icons),
          contentPadding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 20.0),
          labelText: lable,
          focusedBorder: OutlineInputBorder(
            borderSide: BorderSide(color: Colors.red, width: 5.0),
          ),
          enabledBorder: OutlineInputBorder(
            borderSide: BorderSide(color: Colors.grey, width: 0.8),
          )
      ),
    );
  }
}

main

import 'package:flutter/material.dart';
import 'filter.dart';



void main() async{
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.red,
      ),
      debugShowCheckedModeBanner: false,
      home:FilterPage(),


    );
  }
}
lily
  • 63
  • 1
  • 8

2 Answers2

0

Try with the below lines

        Expanded(
          child: Row(
            children: [
           Container(width: 2 ),
              Expanded( 
                child: TexstInput(lable: 'min-Upvote',icons: Icons.favorite,),
              ),
           Container(width: 2 ),
              Expanded( 
                child: TexstInput(lable: 'max-Upvote'),
              ),
           Container(width: 2 ),
            ],
          ),
        ),
        Expanded(
          child: Row(
            children: [
           Container(width: 2 ),
              Expanded( 
                child: TexstInput(lable: 'min',icons: Icons.person_rounded,),
              ),
           Container(width: 2 ),
              Expanded( 
                child: TexstInput(lable: 'max'),
              ),
           Container(width: 2 ),
            ],
          ),
        ),
Shubham Narkhede
  • 2,002
  • 1
  • 5
  • 13
0

Not 100% sure how you imagine your layout. You plan to add more search tags? Change the flex values if you want to. If you want to have your rows right under the FilterListWidget, than add mainAxisAlignment: MainAxisAlignment.start to second Column.

SafeArea(
    child: Column(
      children: [
        Flexible(
          flex: 2,
          child: FilterListWidget(
            allTextList: countList,
            hideheaderText: true,
            selectedTextBackgroundColor: Colors.red,
            applyButonTextBackgroundColor: Colors.red,
            allResetButonColor: Colors.grey,
            onApplyButtonClick: (list) {
              //Navigator.pop(context, list);
            },
          ),
        ),
        Flexible(
          flex: 3,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.end,
            children: [
              Row(
                children: [
                  Container(
                    width: 180,
                    child: TexstInput(lable: 'min-Upvote',icons: Icons.favorite,),
                  ),
                  Container(
                    width: 180,
                    child: TexstInput(lable: 'max-Upvote'),
                  ),
                ],
              ),
              Row(
                children: [
                  Container(
                    width: 180,
                    child: TexstInput(lable: 'min',icons: Icons.person,),
                  ),
                  Container(
                    width: 180,
                    child: TexstInput(lable: 'max'),
                  ),
                ],
              ),
              Container(
                child: RaisedButton(child:Text(
                    'apply'
                ),),
              ),
            ],
          ),
        ),
      ],
    ),
  )
JayJay
  • 141
  • 8
  • I am happy I could help! if you are so kind please upvote my answer. I need karma to finally be able to comment on some posts :). – JayJay Dec 28 '20 at 18:01
  • yap i did it,i marked your answer as solution too! ^^ – lily Dec 28 '20 at 19:34
  • i wrote another question,do you have any Idea about it by any Chance? :D [link] (https://stackoverflow.com/questions/65483783/using-singlechildscrollview-whit-flexible-widget/65483838?noredirect=1#comment115773502_65483838) – lily Dec 28 '20 at 21:27