import 'package:flutter/material.dart'; import '/models/friends.dart'; import '/views/main/friend_list_item.dart'; class FriendList extends StatefulWidget { const FriendList({Key? key}) : super(key: key); @override State createState() => _FriendListState(); } class _FriendListState extends State { List friends = [ Friend(id: 'abc', username: 'Test1'), Friend(id: 'abc', username: 'Test2'), Friend(id: 'abc', username: 'Test3'), Friend(id: 'abc', username: 'Test4'), Friend(id: 'abc', username: 'Test5'), ]; Widget list() { if (friends.isEmpty) { return const Center( child: Text('No Friends'), ); } return ListView.builder( itemCount: friends.length, shrinkWrap: true, padding: const EdgeInsets.only(top: 16), physics: const NeverScrollableScrollPhysics(), itemBuilder: (context, i) { return FriendListItem( id: friends[i].id, username: friends[i].username, ); }, ); } @override Widget build(BuildContext context) { return Scaffold( body: SingleChildScrollView( physics: const BouncingScrollPhysics(), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ SafeArea( child: Padding( padding: const EdgeInsets.only(left: 16,right: 16,top: 10), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ const Text("Friends",style: TextStyle(fontSize: 32,fontWeight: FontWeight.bold),), Container( padding: const EdgeInsets.only(left: 8,right: 8,top: 2,bottom: 2), height: 30, decoration: BoxDecoration( borderRadius: BorderRadius.circular(30), color: Colors.pink[50], ), child: Row( children: const [ Icon(Icons.add,color: Colors.pink,size: 20,), SizedBox(width: 2,), Text("Add",style: TextStyle(fontSize: 14,fontWeight: FontWeight.bold),), ], ), ) ], ), ), ), Padding( padding: const EdgeInsets.only(top: 16,left: 16,right: 16), child: TextField( decoration: InputDecoration( hintText: "Search...", hintStyle: TextStyle(color: Colors.grey.shade600), prefixIcon: Icon(Icons.search,color: Colors.grey.shade600, size: 20,), filled: true, fillColor: Colors.grey.shade100, contentPadding: const EdgeInsets.all(8), enabledBorder: OutlineInputBorder( borderRadius: BorderRadius.circular(20), borderSide: BorderSide( color: Colors.grey.shade100 ) ), ), ), ), Padding( padding: const EdgeInsets.only(top: 16,left: 16,right: 16), child: list(), ), ], ), ), ); } }