flutter 获取父组件大小并布局容器LayoutBuilder_flutter 获取父元素宽度

LayoutBuilder(
    builder: (context,constraints){
      	context为父级上下文
      	constraints.biggest.height;  获取组件在父组件所能设置的最大高度
      	contraints.maxWidth;  获取父组件宽度,高度同理
      	
        return 组件
     } 
  )
1
2
3
4
5
6
7
8
9

代码示例:

LayoutBuilder(
    builder: (context,constraints){
      final endHeight=constraints.biggest.height;
      
        return GestureDetector(
          onVerticalDragDown: (text){ //当点击时会获取点击坐标
              print(endHeight);
              print(constraints.maxHeight);
              print(constraints.maxWidth);
          },
          onVerticalDragEnd: (text){
            print(text);
          },
          onVerticalDragCancel: (){
            print("取消");
          },
          child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
              Icon(Icons.search,size: 15,),
            GestureDetector(
              child:Text('A') ,
              onTap: (){
                scroll.animateTo(312, duration: Duration(milliseconds: 200), curve: Curves.easeIn);
              },
            ),
            GestureDetector(
              child:Text('B') ,
              onTap: (){
                scroll.animateTo(478, duration: Duration(milliseconds: 200), curve: Curves.easeIn);
              },
            ),
            GestureDetector(
              child:Text('C') ,
              onTap: (){
                scroll.animateTo(575, duration: Duration(milliseconds: 200), curve: Curves.easeIn);
              },
            ),
            GestureDetector(
              child:Text('D') ,
              onTap: (){
                scroll.animateTo(741, duration: Duration(milliseconds: 200), curve: Curves.easeIn);
              },
            ),
              Text('E'),
              Text('F'),
              Text('G'),
              Text('H'),
              Text('I'),
              Text('J'),
              Text('K'),
              Text('L'),  
              Text('M'),
              Text('N'),
              Text('O'),
              Text('P'),
              Text('Q'),
              Text('R'),
              Text('S'),
              Text('T'),
              Text('U'),
              Text('V'),
              Text('W'),
              Text('X'),
              Text("Y"),
              Text("#")                                   
            ],
          ),
        );
    },
                )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72