在抖动中实现搜索功能

时间:2020-07-13 19:14:06

标签: flutter

在下面的代码中,我正在使用构建器类填充较长的列表视图,并且我无法实现从构建器dart文件中获取标题的搜索功能。 搜索栏的索引为零,列表从索引+1开始填充。 _searchBar是搜索功能。 列表视图是在SingleChildScrollView中生成的。

main.dart

   

     import 'package:flutter/material.dart';
        import 'package:flutter_app/constants.dart';
        import 'package:flutter_app/homescreen.dart';
        import 'package:flutter_app/productsall.dart';
        
        // ignore: camel_case_types
        class productHome extends StatefulWidget {
          @override
          _productHomeState createState() => _productHomeState();
        }
        
        // ignore: camel_case_types
        class _productHomeState extends State<productHome> {
          int _selectedItem = 1;
          @override
          Widget build(BuildContext context) {
            return Scaffold(
              bottomNavigationBar: CustomBottomNavigationBar(
                iconList: [
                  Icons.home,
                  Icons.add_shopping_cart,
                  Icons.save_alt,
                  Icons.person,
                ],
                onChange: (val) {
                  setState(() {
                    _selectedItem = val;
                  });
                },
                defaultSelectedIndex: 1,
              ),
              body: ListView(
                padding: EdgeInsets.only(left: 20.0),
                children: <Widget>[
                  SizedBox(height: 45.0),
                  Text(
                    ' Product List',
                    style: TextStyle(
                      fontFamily: 'Poppins',
                      fontSize: 42.0,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                  SingleChildScrollView(
                    child: Column(
                      children: <Widget>[
                        ListView.builder(
                          shrinkWrap: true,
                          physics: NeverScrollableScrollPhysics(),
                          itemCount: productAll.length + 1,
                          itemBuilder: (context, index) {
                            return index == 0
                                ? _searchBar()
                                : ProductCardMain(
                                    itemIndex: index,
                                    productFinal: productAll[index - 1]);
                          },
                        )
                      ],
                    ),
                  )
                ],
              ),
            );
          }
        }
        
        _searchBar() {
          return Padding(
            padding: const EdgeInsets.all(20.0),
            child: TextField(
                decoration: InputDecoration(
                    enabledBorder: InputBorder.none,
                    focusedBorder: InputBorder.none,
                    icon: Icon(Icons.search),
                    hintText: "Search",
                    hintStyle: TextStyle(fontFamily: 'Poppins'))),
          );
        }
        
        class ProductCardMain extends StatelessWidget {
          const ProductCardMain({
            Key key,
            this.itemIndex,
            this.productFinal,
            this.press,
          }) : super(key: key);
        
          final int itemIndex;
          final ProductAll productFinal;
          final Function press;
        
          @override
          Widget build(BuildContext context) {
            Size size = MediaQuery.of(context).size;
            return Container(
              margin: EdgeInsets.symmetric(horizontal: 20.0, vertical: 20.0 / 2),
              // color: Colors.blueAccent,
              height: 160,
              child: InkWell(
                onTap: press,
                child: Stack(
                  alignment: Alignment.bottomCenter,
                  children: <Widget>[
                    Container(
                      height: 166,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(22),
                        color: Colors.orange,
                        boxShadow: [kDefaultShadow],
                      ),
                      child: Container(
                        margin: EdgeInsets.only(right: 10),
                        decoration: BoxDecoration(
                            color: Colors.white,
                            borderRadius: BorderRadius.circular(22)),
                      ),
                    ),
                    Positioned(
                      top: 0,
                      left: 0,
                      child: Container(
                        padding: EdgeInsets.symmetric(horizontal: 20.0),
                        height: 160,
                        width: 200,
                        child: Image.asset(
                          productFinal.image,
                          fit: BoxFit.cover,
                        ),
                      ),
                    ),
                    Positioned(
                      bottom: 0,
                      right: 0,
                      child: SizedBox(
                        height: 146,
                        width: size.width - 200,
                        child: Column(
                          children: <Widget>[
                            Padding(
                              padding: const EdgeInsets.only(
                                  left: 50.0, top: 20.0, right: 20),
                              child: Text(productFinal.title,
                                  style: TextStyle(
                                      fontFamily: 'Poppins',
                                      fontWeight: FontWeight.bold)),
                            )
                          ],
                        ),
                      ),
                    ),
                    Positioned(
                      bottom: 0,
                      right: 0,
                      child: SizedBox(
                        height: 146,
                        width: size.width - 200,
                        child: Column(
                          children: <Widget>[
                            Padding(
                              padding: const EdgeInsets.only(
                                  left: 50.0, top: 80.0, right: 20),
                              child: Text(productFinal.titledesc,
                                  style: TextStyle(
                                      fontFamily: 'Poppins',
                                      fontWeight: FontWeight.bold,
                                      fontSize: 10)),
                            )
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            );
          }
        }

ProductAll.dart

  

      class ProductAll {
          final int id;
          final String title, description, descriptiontwo, image, titledesc;
        
          ProductAll(
              {this.id,
              this.title,
              this.description,
              this.image,
              this.descriptiontwo,
              this.titledesc});
        }
        
        
        List<ProductAll> productAll = [
          ProductAll(
              id: 1,
              title: 'First Product',
              image: 'assets/images/product/one.jpg',
              titledesc: 'First Product - 1',
              description:
                  "Text",
              descriptiontwo:
                  "Hello"),
        ProductAll(
              id: 1,
              title: 'First Product',
              image: 'assets/images/product/one.jpg',
              titledesc: 'First Product - 1',
              description:
                  "Text",
              descriptiontwo:
                  "Hello"),
        
    ];

0 个答案:

没有答案