美文网首页
Flutter 两级折叠列表

Flutter 两级折叠列表

作者: 菜鸟何时起飞 | 来源:发表于2020-08-14 18:17 被阅读0次
    import 'package:first_flutter_app/widgets/list/list_bean.dart';
    import 'package:flutter/material.dart';
    
    typedef GroupChildViewCreate = Widget Function(int parentIndex,int childIndex);
    typedef SectionViewCreate = Widget Function(int index);
    
    class TwoLevelWidget<T extends BaseBean> extends StatefulWidget{
    
      final GroupChildViewCreate groupChildViewCreate;
      final SectionViewCreate sectionViewCreate;
      final T data;
      TwoLevelWidget(
          this.groupChildViewCreate,
          this.sectionViewCreate,
          this.data,
          );
    
      @override
      State<StatefulWidget> createState() =>  _TwoLevelWidgetState();
    
    }
    
    class _TwoLevelWidgetState extends State<TwoLevelWidget>{
    
      @override
      Widget build(BuildContext context) {
    
        return Column(
          children: <Widget>[
            Container(
              width: double.infinity,
              child: widget.sectionViewCreate(widget.data.index),
            ),
            widget.data.isOpen ? Padding(
                padding: EdgeInsets.only(left: 30),
                child:  ListView.builder(
                  itemBuilder: (context,index){
                    return widget.groupChildViewCreate(widget.data.index,index);
                  },
                  itemCount: widget.data.getChildSize(),
                  shrinkWrap: true,/*内嵌listView 这个值要设置成true*/
                  primary: true,
                  physics: NeverScrollableScrollPhysics(), /*嵌套滑动这个也得限制 不然 滑动子列表 外层不滚动*/
                )
            ) : Container()
          ],
        );
    
      }
    
    }
    
    import 'package:first_flutter_app/util/log_utils.dart';
    import 'package:first_flutter_app/widgets/list/two_level_widget.dart';
    import 'package:first_flutter_app/widgets/list/list_bean.dart';
    import 'package:flutter/gestures.dart';
    import 'package:flutter/material.dart';
    
    
    
    
    class GroupListView<T extends BaseBean> extends StatefulWidget {
    
      ///Function which returns the number of items(rows) in a specified section.
      final int Function(int section) countOfItemInSection;
    
    
      //Fields from ListView.builder constructor
    
      /// The axis along which the scroll view scrolls.
      ///
      /// Defaults to [Axis.vertical].
      final Axis scrollDirection;
    
      /// Whether the scroll view scrolls in the reading direction.
      ///
      /// For example, if the reading direction is left-to-right and
      /// [scrollDirection] is [Axis.horizontal], then the scroll view scrolls from
      /// left to right when [reverse] is false and from right to left when
      /// [reverse] is true.
      ///
      /// Similarly, if [scrollDirection] is [Axis.vertical], then the scroll view
      /// scrolls from top to bottom when [reverse] is false and from bottom to top
      /// when [reverse] is true.
      ///
      /// Defaults to false.
      final bool reverse;
    
      /// An object that can be used to control the position to which this scroll
      /// view is scrolled.
      ///
      /// Must be null if [primary] is true.
      ///
      /// A [ScrollController] serves several purposes. It can be used to control
      /// the initial scroll position (see [ScrollController.initialScrollOffset]).
      /// It can be used to control whether the scroll view should automatically
      /// save and restore its scroll position in the [PageStorage] (see
      /// [ScrollController.keepScrollOffset]). It can be used to read the current
      /// scroll position (see [ScrollController.offset]), or change it (see
      /// [ScrollController.animateTo]).
      final ScrollController controller;
    
      /// Whether this is the primary scroll view associated with the parent
      /// [PrimaryScrollController].
      ///
      /// When this is true, the scroll view is scrollable even if it does not have
      /// sufficient content to actually scroll. Otherwise, by default the user can
      /// only scroll the view if it has sufficient content. See [physics].
      ///
      /// On iOS, this also identifies the scroll view that will scroll to top in
      /// response to a tap in the status bar.
      ///
      /// Defaults to true when [scrollDirection] is [Axis.vertical] and
      /// [controller] is null.
      final bool primary;
    
      /// How the scroll view should respond to user input.
      ///
      /// For example, determines how the scroll view continues to animate after the
      /// user stops dragging the scroll view.
      ///
      /// Defaults to matching platform conventions. Furthermore, if [primary] is
      /// false, then the user cannot scroll if there is insufficient content to
      /// scroll, while if [primary] is true, they can always attempt to scroll.
      ///
      /// To force the scroll view to always be scrollable even if there is
      /// insufficient content, as if [primary] was true but without necessarily
      /// setting it to true, provide an [AlwaysScrollableScrollPhysics] physics
      /// object, as in:
      ///
      /// ```dart
      ///   physics: const AlwaysScrollableScrollPhysics(),
      /// ```
      ///
      /// To force the scroll view to use the default platform conventions and not
      /// be scrollable if there is insufficient content, regardless of the value of
      /// [primary], provide an explicit [ScrollPhysics] object, as in:
      ///
      /// ```dart
      ///   physics: const ScrollPhysics(),
      /// ```
      ///
      /// The physics can be changed dynamically (by providing a new object in a
      /// subsequent build), but new physics will only take effect if the _class_ of
      /// the provided object changes. Merely constructing a new instance with a
      /// different configuration is insufficient to cause the physics to be
      /// reapplied. (This is because the final object used is generated
      /// dynamically, which can be relatively expensive, and it would be
      /// inefficient to speculatively create this object each frame to see if the
      /// physics should be updated.)
      final ScrollPhysics physics;
    
      /// Whether the extent of the scroll view in the [scrollDirection] should be
      /// determined by the contents being viewed.
      ///
      /// If the scroll view does not shrink wrap, then the scroll view will expand
      /// to the maximum allowed size in the [scrollDirection]. If the scroll view
      /// has unbounded constraints in the [scrollDirection], then [shrinkWrap] must
      /// be true.
      ///
      /// Shrink wrapping the content of the scroll view is significantly more
      /// expensive than expanding to the maximum allowed size because the content
      /// can expand and contract during scrolling, which means the size of the
      /// scroll view needs to be recomputed whenever the scroll position changes.
      ///
      /// Defaults to false.
      final bool shrinkWrap;
    
      /// The amount of space by which to inset the children.
      final EdgeInsetsGeometry padding;
    
      /// If non-null, forces the children to have the given extent in the scroll
      /// direction.
      ///
      /// Specifying an [itemExtent] is more efficient than letting the children
      /// determine their own extent because the scrolling machinery can make use of
      /// the foreknowledge of the children's extent to save work, for example when
      /// the scroll position changes drastically.
      final double itemExtent;
    
      /// Whether to wrap each child in an [AutomaticKeepAlive].
      ///
      /// Typically, children in lazy list are wrapped in [AutomaticKeepAlive]
      /// widgets so that children can use [KeepAliveNotification]s to preserve
      /// their state when they would otherwise be garbage collected off-screen.
      ///
      /// This feature (and [addRepaintBoundaries]) must be disabled if the children
      /// are going to manually maintain their [KeepAlive] state. It may also be
      /// more efficient to disable this feature if it is known ahead of time that
      /// none of the children will ever try to keep themselves alive.
      ///
      /// Defaults to true.
      final bool addAutomaticKeepAlives;
    
      /// Whether to wrap each child in a [RepaintBoundary].
      ///
      /// Typically, children in a scrolling container are wrapped in repaint
      /// boundaries so that they do not need to be repainted as the list scrolls.
      /// If the children are easy to repaint (e.g., solid color blocks or a short
      /// snippet of text), it might be more efficient to not add a repaint boundary
      /// and simply repaint the children during scrolling.
      ///
      /// Defaults to true.
      final bool addRepaintBoundaries;
    
      /// Whether to wrap each child in an [IndexedSemantics].
      ///
      /// Typically, children in a scrolling container must be annotated with a
      /// semantic index in order to generate the correct accessibility
      /// announcements. This should only be set to false if the indexes have
      /// already been provided by an [IndexedChildSemantics] widget.
      ///
      /// Defaults to true.
      ///
      /// See also:
      ///
      ///  * [IndexedChildSemantics], for an explanation of how to manually
      ///    provide semantic indexes.
      final bool addSemanticIndexes;
    
      /// {@macro flutter.rendering.viewport.cacheExtent}
      final double cacheExtent;
    
      /// The number of children that will contribute semantic information.
      ///
      /// Some subtypes of [ScrollView] can infer this value automatically. For
      /// example [ListView] will use the number of widgets in the child list,
      /// while the [new ListView.separated] constructor will use half that amount.
      ///
      /// For [CustomScrollView] and other types which do not receive a builder
      /// or list of widgets, the child count must be explicitly provided. If the
      /// number is unknown or unbounded this should be left unset or set to null.
      ///
      /// See also:
      ///
      ///  * [SemanticsConfiguration.scrollChildCount], the corresponding semantics property.
      final int semanticChildCount;
    
      /// {@macro flutter.widgets.scrollable.dragStartBehavior}
      final DragStartBehavior dragStartBehavior;
      final GroupChildViewCreate groupChildViewCreate;
      final List<T> data;
      final SectionViewCreate sectionViewCreate;
    
      const GroupListView({
        Key key,
        @required this.countOfItemInSection,
        this.scrollDirection = Axis.vertical,
        this.reverse = false,
        this.controller,
        this.primary,
        this.physics,
        this.shrinkWrap = false,
        this.padding,
        this.itemExtent,
        this.addAutomaticKeepAlives = true,
        this.addRepaintBoundaries = true,
        this.addSemanticIndexes = true,
        this.cacheExtent,
        this.semanticChildCount,
        this.dragStartBehavior = DragStartBehavior.start,
        this.groupChildViewCreate,
        @required this.data,
        @required this.sectionViewCreate
      })  :assert(data != null),
            assert(countOfItemInSection != null),
            super(key: key);
    
      @override
      _GroupListViewState createState() => _GroupListViewState();
    }
    
    class _GroupListViewState extends State<GroupListView> {
    
      @override
      Widget build(BuildContext context) {
    
        return ListView.builder(
          scrollDirection: widget.scrollDirection,
          reverse: widget.reverse,
          controller: widget.controller,
          primary: widget.primary,
          physics: widget.physics,
          shrinkWrap: widget.shrinkWrap,
          padding: widget.padding,
          itemExtent: widget.itemExtent,
          addAutomaticKeepAlives: widget.addAutomaticKeepAlives,
          addRepaintBoundaries: widget.addRepaintBoundaries,
          addSemanticIndexes: widget.addSemanticIndexes,
          cacheExtent: widget.cacheExtent,
          semanticChildCount: widget.semanticChildCount,
          dragStartBehavior: widget.dragStartBehavior,
          itemCount: widget.data.length,
          itemBuilder: _itemBuilder,
        );
    
      }
    
    
      Widget _itemBuilder(BuildContext context, int index) {
        return  TwoLevelWidget(widget.groupChildViewCreate,widget.sectionViewCreate,widget.data[index]);
      }
    }
    
    abstract class BaseBean{
    
      bool isOpen = true;
      int index = 0;
      int  getChildSize();
    }
    
    
    class ParentBean extends BaseBean{
    
      String title;
      List<ChildBean> childBeans = [];
    
      @override
      int getChildSize() => childBeans.length;
    
    }
    
    
    class ChildBean{
    
      int childIndex;
      String childTitle;
    
    }
    
    import 'dart:core';
    
    import 'package:first_flutter_app/widgets/list/list_view.dart';
    import 'package:first_flutter_app/widgets/list/list_bean.dart';
    import 'package:flutter/material.dart';
    
    class GroupListPage extends StatefulWidget{
      @override
      State<StatefulWidget> createState()  => _GroupListPageState();
    }
    
    class _GroupListPageState extends State<GroupListPage>{
    
    
      List<ParentBean> parentBean = [];
    
      int clickSectionIndex = -1;
    
      @override
      void initState() {
        super.initState();
        initData();
      }
    
      void initData(){
        for(int i=0;i<10;i++){
          ParentBean parentData = ParentBean();
          parentData.index = i;
          parentData.title = "title$i";
          List<ChildBean> childBeans = [];
          for(int j=0;j<10;j++){
            ChildBean childBean = ChildBean();
            childBean.childIndex = j;
            childBean.childTitle = "childTitl$j";
            childBeans.add(childBean);
          }
          parentData.childBeans = childBeans;
          parentBean.add(parentData);
        }
      }
    
      @override
      Widget build(BuildContext context) {
    
        return new Scaffold(
            backgroundColor: Colors.blue,
            body: GroupListView<ParentBean>(
              data: parentBean,
              countOfItemInSection: (int parentIndex) {
                return parentBean[parentIndex].childBeans.length;
              },
              groupChildViewCreate: (parentIndex,childIndex){
                return Text(
                  parentBean[parentIndex].childBeans[childIndex].childTitle,
                  style: TextStyle(color: Colors.white, fontSize: 18),
                );
              },
              sectionViewCreate: (section){
                return GestureDetector(
                  child:  Padding(
                    padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 8),
                    child: Text(
                      parentBean[section].title,
                      style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600),
                    ),
                  ),
                  onTap: (){
                    parentBean[section].isOpen = !parentBean[section].isOpen;
                    setState(() {
    
                    });
                  },
                );
              },
            )
        );
      }
    
    }
    

    相关文章

      网友评论

          本文标题:Flutter 两级折叠列表

          本文链接:https://www.haomeiwen.com/subject/ubkndktx.html