stack定位（不同情况在的定位）

//stack在不同宽度高度，其高度宽度在不同情况大小不同

            //

            //第一种 stack外面直接包裹container， container设置宽度以及高度

            //这种情况 container用不用Position包裹着都一样，因为父元素已经设置宽度以及高度，直接根据父元素进行定位

                    // Container(

                    //   height: 200,

                    //   width: 300,

                    //   color: Colors.pink[200],

                    //   child: Stack(

                    //     children: [

                    //       Container(

                    //         height: 100,

                    //         width: 100,

                    //         color: Colors.yellow,

                    //       ),

                    //       Positioned(

                    //         left: 0,

                    //         bottom: 0,

                    //         child: Text("hjgfhjgfhdjg" ))

                    //     ],

                    //   ),

                    // ),

            //第二种：用Container包裹着，但是不设置其宽度高度，但是外层用SizeBox或者Padding组件包裹着

                  // SizedBox(

                  //   height: 300,

                  //   width: 300,

                  //   child: Container(

                  //     color: Colors.amber, //因为 这里得container得高度以及宽度就是300，300，

                  //     // 所以就类似第一种情况了，所以stack里面得container用不用Position包裹着都一样

                  //     child: Stack(

                  //       children: [

                  //         Positioned(

                  //           top: 10,

                  //           left: 10,

                  //           child: Container(

                  //             height: 50,

                  //             width: 50,

                  //             color: Colors.white,

                  //           ),

                  //         ),

                  //         Positioned(

                  //             bottom: 10,

                  //             // left: 50,

                  //             child: Text("fhjdgfvhjs"))

                  //       ],

                  //     ),

                  //   ),

                  // )

                  // SizedBox(

                  //   height: 300,

                  //   width: 300,

                  //   child: Padding(

                  //     padding: EdgeInsets.all(20),

                  //     child: Container(

                  //       color: Colors

                  //           .amber, //因为这里的contianer的宽度为260，高度为260，所以这里的情况也类似第一种 所以stack里面得container用不用Position包裹着都一样

                  //       child: Stack(    //即stack的父元素有宽度以及高度

                  //         children: [

                  //           Container(

                  //             height: 50,

                  //             width: 50,

                  //             color: Colors.white,

                  //           ),

                  //           Positioned(

                  //               bottom: 10,

                  //               // left: 50,

                  //               child: Text("fhjdgfvhjs"))

                  //         ],

                  //       ),

                  //     ),

                  //   ),

                  // )

 

            //第三种 （注意点）不用container包裹着，但是外层用colum或者row包裹着(注意，这里已经开始不同)

                    //  Row(

                    //   children: [

                    //     Stack(    //因为stack的父元素是column,所以stack的宽度以及高度就是以子元素来解决的，

                    //       children: [

                       

                    //           Text("bgjdfghjg"),//因为现在Text()，没有用Position包裹着，所以现在stack的宽度以及高度由Text()决定

                    //         Positioned(

                    //           bottom: 0,

                    //           left: 0,

                    //           child:

                    //         Container(    //因为stack的宽度以及高度由Text()决定，那么Container()就相对于Text()定位

                    //           height:5,

                    //           width: 400,

                    //           color: Colors.pink[200],

                    //         ))

                    //       ],

                    //     )

                    //   ],

                    //  ),     //注意（这里Text()不能用Position进行包裹着定位，因为stack没有宽度以及高度，不然是或报错的）

 

           //第四种 用column或者row包裹着，但是column的外层用container包裹着

                    Container(

                      height: 300,

                      width: 300,

                      child: Column(

                        children: [  

                          Stack(   //虽然用外层用contianer，并定义宽度以及高度，但是现在的stack是没有宽度以及高度的，由stack的子元素决定（类似第三种情况）

                            children: [

                                Text("bgjdfghjg"),//因为现在Text()，没有用Position包裹着，所以现在stack的宽度以及高度由Text()决定

                            Positioned(

                              bottom: 0,

                              left: 0,

                              child:

                            Container(    //因为stack的宽度以及高度由Text()决定，那么Container()就相对于Text()定位

                              height:5,

                              width: 400,

                              color: Colors.pink[200],

                            ))

                            ],

                          )

                        ],

                      ),

                    ) //注意（这里Text()不能用Position进行包裹着定位，因为stack没有宽度以及高度，不然是或报错的）

 

           //  总结：针对不同情况的stack的宽度以及高度不同， 注意就是看其父元素有没有宽度以及高度，没有的话就由其子元素决定