home_page.dart
1import 'package:chat_app/main.dart'; 2import 'package:chat_app/model/post.dart'; 3import 'package:chat_app/model/user.dart'; 4import 'package:chat_app/pages/post_page.dart'; 5import 'package:chat_app/utils/widget_utils.dart'; 6import 'package:cloud_firestore/cloud_firestore.dart'; 7import 'package:flutter/material.dart'; 8import 'package:intl/intl.dart'; 9 10class HomePage extends StatefulWidget { 11 const HomePage({super.key}); 12 13 @override 14 State<HomePage> createState() => _HomePageState(); 15} 16 17class _HomePageState extends State<HomePage> { 18 List<User> postedUser = [ 19 User( 20 name: "Emma", 21 uid: "0001", 22 ), 23 User( 24 name: "John", 25 uid: "0002", 26 ), 27 User( 28 name: "Mark", 29 uid: "0003", 30 ), 31 User( 32 name: "Stefan", 33 uid: "0004", 34 ), 35 ]; 36 List<Post> userPostsList = [ 37 Post( 38 id: "0001", 39 postAccountId: "0001", 40 postTime: Timestamp.now(), 41 imagePath: 42 "https://images.unsplash.com/photo-1471922694854-ff1b63b20054?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1472&q=80", 43 content: 'On a sunny day, you can still go to the beach 🌊.', 44 ), 45 Post( 46 id: "0002", 47 postAccountId: "0002", 48 postTime: Timestamp.now(), 49 imagePath: 50 "https://images.unsplash.com/photo-1542233637-20456b09d882?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=774&q=80", 51 content: 'A day healed by nature 🌳.', 52 ), 53 Post( 54 id: "0003", 55 postAccountId: "0003", 56 postTime: Timestamp.now(), 57 imagePath: "https://cdn.pixabay.com/photo/2010/11/26/canyon-203_1280.jpg", 58 content: 'Lovely views taken on my trip ✨.', 59 ), 60 Post( 61 id: "0004", 62 postAccountId: "0004", 63 postTime: Timestamp.now(), 64 imagePath: 65 "https://images.unsplash.com/photo-1544005313-94ddf0286df2?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=MnwxNTgwfDB8MXxzZWFyY2h8M3x8cGVyc29ufGVufDB8fHx8MTY4MTM4NjM2MQ&ixlib=rb-4.0.3&q=80&w=400", 66 content: 'Great walk on a sunny day.', 67 ), 68 ]; 69 @override 70 Widget build(BuildContext context) { 71 return Scaffold( 72 appBar: WidgetUtils.createAppBar("Home"), 73 body: ListView.builder( 74 itemCount: userPostsList.length, 75 itemBuilder: (context, index) { 76 final post = userPostsList[index]; 77 final user = 78 postedUser.firstWhere((user) => user.uid == post.postAccountId); 79 final formattedDate = DateFormat('EEE MMM dd yyyy HH:mm').format( 80 post.postTime!.toDate(), 81 ); 82 return Card( 83 child: SizedBox( 84 height: 350, 85 child: Column( 86 children: [ 87 ListTile( 88 leading: const CircleAvatar( 89 backgroundImage: NetworkImage( 90 "https://images.unsplash.com/photo-1472396961693-142e6e269027?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=MnwxNTgwfDB8MXxzZWFyY2h8Mjl8fE5hdHVyZXxlbnwwfHx8fDE2NzgwODY0NTY&ixlib=rb-4.0.3&q=80&w=400", 91 ), 92 ), 93 title: Text( 94 user.name, 95 style: const TextStyle( 96 fontWeight: FontWeight.bold, 97 ), 98 ), 99 subtitle: Text( 100 formattedDate, 101 style: const TextStyle( 102 fontWeight: FontWeight.normal, 103 ), 104 ), 105 ), 106 Expanded( 107 child: Container( 108 decoration: BoxDecoration( 109 image: DecorationImage( 110 image: NetworkImage( 111 post.imagePath!, 112 ), 113 fit: BoxFit.cover, 114 ), 115 ), 116 ), 117 ), 118 const SizedBox( 119 height: 14.0, 120 ), 121 Row( 122 mainAxisAlignment: MainAxisAlignment.spaceEvenly, 123 children: [ 124 Row( 125 children: const [ 126 Icon( 127 Icons.thumb_up, 128 color: Colors.grey, 129 ), 130 SizedBox( 131 width: 8.0, 132 ), 133 Text( 134 "Like", 135 style: TextStyle( 136 color: Colors.grey, 137 ), 138 ), 139 ], 140 ), 141 Row( 142 children: const [ 143 Icon( 144 Icons.comment, 145 color: Colors.grey, 146 ), 147 SizedBox( 148 width: 8.0, 149 ), 150 Text( 151 "Comments", 152 style: TextStyle( 153 color: Colors.grey, 154 ), 155 ), 156 ], 157 ), 158 Row( 159 children: const [ 160 Icon( 161 Icons.share, 162 color: Colors.grey, 163 ), 164 SizedBox( 165 width: 8.0, 166 ), 167 Text( 168 "Share", 169 style: TextStyle( 170 color: Colors.grey, 171 ), 172 ), 173 ], 174 ), 175 ], 176 ), 177 const SizedBox( 178 height: 12.0, 179 ), 180 ], 181 ), 182 ), 183 ); 184 }, 185 ), 186 floatingActionButton: FloatingActionButton( 187 backgroundColor: materialWhite, 188 foregroundColor: Colors.black, 189 onPressed: () => showModalBottomSheet( 190 shape: const RoundedRectangleBorder( 191 borderRadius: BorderRadius.all( 192 Radius.circular(100), 193 ), 194 ), 195 context: context, 196 isScrollControlled: true, 197 builder: (BuildContext context) { 198 return SingleChildScrollView( 199 child: SizedBox( 200 height: MediaQuery.of(context).size.height * 0.85, 201 child: Padding( 202 padding: EdgeInsets.only( 203 bottom: MediaQuery.of(context).viewInsets.bottom, 204 ), 205 child: const PostPage(), 206 ), 207 ), 208 ); 209 }, 210 ), 211 child: const Icon(Icons.add), 212 ), 213 ); 214 } 215} 216
0 コメント