facebook design user history views flutter

 Container(

      height: 300,

      color: Colors.white,

      child:ListView.builder(

          scrollDirection: Axis.horizontal,

          shrinkWrap: true,

          physics: ScrollPhysics(),

          itemCount: 15,

          itemBuilder: (BuildContext context, int index) {

            return Container(

                width: 180,

                margin: const EdgeInsets.all(15.0),

                padding: const EdgeInsets.all(3.0),

                decoration: BoxDecoration(

                  color: Colors.white60,

                  border: Border.all(

                      width: 2.0

                  ),

                  borderRadius: BorderRadius.all(

                      Radius.circular(0.0) //                 <--- border radius here

                  ),

                ),

                child: Stack(

                  children: <Widget>[

                    Column(

                      crossAxisAlignment: CrossAxisAlignment.start,

                      children: <Widget>[

                        Image(

                          fit: BoxFit.cover,

                          width: MediaQuery.of(context).size.width,

                          height: 260.0,

                          image: AssetImage('assets/images/no_photo_available.png'),

                        ),



                      ],


                    ),

                    Container(

                      width: 50,

                      height: 50,

                      margin: EdgeInsets.all(10),

                      decoration: BoxDecoration(

                        color: Colors.blue,

                        borderRadius: BorderRadius.circular(100),

                        // border: Border(

                        //   left: BorderSide(

                        //     color: Colors.blue,

                        //     width: 2.0,

                        //   ),

                        // ),

                      ),

                      child: ClipOval(


                        child: Image(

                          fit: BoxFit.cover,

                          width: 50,

                          height: 50,

                          image: AssetImage('assets/images/no_photo_available.png'),

                        ),

                      ),

                    ),


                    Positioned(

                      bottom: 0,

                      left: 0,

                      child: Container(


                        width: 100,

                        height: 40,

                        color: Colors.black12,

                        child: Text('20293',textAlign: TextAlign.center,),

                      ),

                    ),

                  ],

                )

            );

          }

      ),


    ),

Comments