Q&A
```circle_button.dart
import 'package:flutter/material.dart';
class CircleButton extends StatelessWidget {
final IconData icon;
final double iconSize;
final VoidCallback? onPressed;
const CircleButton({
super.key,
required this.icon,
required this.iconSize,
required this.onPressed,
});
@override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.all(6.0),
decoration: BoxDecoration(
color: Colors.grey[200],
shape: BoxShape.circle,
),
child: IconButton(
onPressed: onPressed,
icon: Icon(icon),
color: Colors.black,
iconSize: iconSize,
),
);
}
}
```
```create_post_container.dart
import 'package:facebook_clone/widgets/widgets.dart';
import 'package:flutter/material.dart';
import '../models/models.dart';
class CreatePostContainer extends StatelessWidget {
final User currentUser;
const CreatePostContainer({super.key, required this.currentUser});
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.fromLTRB(12.0, 8.0, 12.0, 0.0),
color: Colors.white,
child: Column(
children: [
Row(
children: [
ProfileAvatar(imageUrl: currentUser.imageUrl),
SizedBox(width: 8.0),
Expanded(
child: TextField(
decoration: InputDecoration.collapsed(
hintText: "What\'s on your mind?",
),
),
),
],
),
Divider(
height: 10.0,
thickness: 0.5,
),
Container(
height: 40.0,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
TextButton.icon(
style: TextButton.styleFrom(
foregroundColor: Colors.black,
),
onPressed: () => print("Live"),
icon: Icon(
Icons.video_camera_back,
color: Colors.red,
),
label: Text("Live"),
),
VerticalDivider(
width: 8.0,
),
TextButton.icon(
style: TextButton.styleFrom(
foregroundColor: Colors.black,
),
onPressed: () => print("Photo"),
icon: Icon(
Icons.photo_library,
color: Colors.green,
),
label: Text("Photo"),
),
VerticalDivider(
width: 8.0,
),
TextButton.icon(
style: TextButton.styleFrom(
foregroundColor: Colors.black,
),
onPressed: () => print("Room"),
icon: Icon(
Icons.video_call,
color: Colors.purpleAccent,
),
label: Text("Room"),
),
VerticalDivider(
width: 8.0,
),
],
),
),
],
),
);
}
}
```
```rooms.dart
import 'package:facebook_clone/config/palette.dart';
import 'package:facebook_clone/models/user_model.dart';
import 'package:facebook_clone/widgets/widgets.dart';
import 'package:flutter/material.dart';
class Rooms extends StatelessWidget {
final List<User> onlineUsers;
const Rooms({super.key, required this.onlineUsers});
@override
Widget build(BuildContext context) {
return Container(
height: 60.0,
color: Colors.white,
child: ListView.builder(
padding: EdgeInsets.symmetric(
vertical: 10.0,
horizontal: 4.0,
),
scrollDirection: Axis.horizontal,
itemCount: 1 + onlineUsers.length,
itemBuilder: (BuildContext context, int index) {
if (index == 0) {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 8.0),
child: _CreateRoomButton(),
);
}
final User user = onlineUsers[index - 1];
return Padding(
padding: EdgeInsets.symmetric(horizontal: 8.0),
child: ProfileAvatar(
imageUrl: user.imageUrl,
isActive: true,
),
);
},
),
);
}
}
class _CreateRoomButton extends StatelessWidget {
const _CreateRoomButton({super.key});
@override
Widget build(BuildContext context) {
return OutlinedButton(
onPressed: () => print("Create Room"),
child: Row(
children: [
ShaderMask(
shaderCallback: (rect) =>
Palette.createRoomGradient.createShader(rect),
child: Icon(
Icons.video_call,
size: 35.0,
color: Colors.white,
),
),
SizedBox(
width: 4.0,
),
Text(
"Create\nRoom",
),
],
),
style: OutlinedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(30.0),
side: BorderSide(
width: 3.0,
color: Colors.blueAccent[100]!,
),
),
textStyle: TextStyle(
color: Palette.facebookBlue,
),
),
);
}
}
```
```profile_avatar.dart
import 'package:cached_network_image/cached_network_image.dart';
import 'package:facebook_clone/config/palette.dart';
import 'package:facebook_clone/data/data.dart';
import 'package:flutter/material.dart';
class ProfileAvatar extends StatelessWidget {
final String? imageUrl;
final bool isActive;
final bool hasBorder;
const ProfileAvatar({
super.key,
required this.imageUrl,
this.isActive = false,
this.hasBorder = false,
});
@override
Widget build(BuildContext context) {
return Stack(
children: [
CircleAvatar(
radius: 20.0,
backgroundColor: Palette.facebookBlue,
child: CircleAvatar(
radius: hasBorder ? 17.0 : 20.0,
backgroundColor: Colors.grey[200],
backgroundImage: CachedNetworkImageProvider(imageUrl.toString()),
),
),
isActive
? Positioned(
bottom: 0.0,
right: 0.0,
child: Container(
height: 15.0,
width: 15.0,
decoration: BoxDecoration(
color: Palette.online,
shape: BoxShape.circle,
border: Border.all(
width: 2.0,
color: Colors.white,
),
),
),
)
: SizedBox.shrink(),
],
);
}
}
```
```stories.dart
import 'dart:ffi';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:facebook_clone/config/palette.dart';
import 'package:facebook_clone/widgets/widgets.dart';
import 'package:flutter/material.dart';
import '../models/models.dart';
class Stories extends StatelessWidget {
final User currentUser;
final List<Story> stories;
const Stories({super.key, required this.currentUser, required this.stories});
@override
Widget build(BuildContext context) {
return Container(
height: 200.0,
color: Colors.white,
child: ListView.builder(
padding: EdgeInsets.symmetric(
vertical: 10.0,
horizontal: 8.0,
),
scrollDirection: Axis.horizontal,
itemCount: stories.length,
itemBuilder: (BuildContext context, int index) {
if (index == 0) {
return Padding(
padding: EdgeInsets.symmetric(
horizontal: 4.0,
),
child: _StoryCard(
isAddStory: true,
currentUser: currentUser,
story: stories[index],
),
);
}
return Padding(
padding: EdgeInsets.symmetric(horizontal: 4.0),
child: _StoryCard(
story: stories[index],
currentUser: currentUser,
),
);
},
),
);
}
}
class _StoryCard extends StatelessWidget {
final bool isAddStory;
final User currentUser;
final Story story;
const _StoryCard({
super.key,
this.isAddStory = false,
required this.currentUser,
required this.story,
});
@override
Widget build(BuildContext context) {
return Stack(
children: [
ClipRRect(
borderRadius: BorderRadius.circular(12.0),
child: CachedNetworkImage(
imageUrl: isAddStory
? currentUser.imageUrl.toString()
: story.imageUrl.toString(),
height: double.infinity,
width: 110.0,
fit: BoxFit.cover,
),
),
Container(
height: double.infinity,
width: 110.0,
decoration: BoxDecoration(
gradient: Palette.storyGradient,
borderRadius: BorderRadius.circular(12.0),
),
),
Positioned(
top: 8.0,
left: 8.0,
child: isAddStory
? Container(
height: 40.0,
width: 40.0,
decoration: BoxDecoration(
color: Colors.white,
shape: BoxShape.circle,
),
child: IconButton(
padding: EdgeInsets.zero,
icon: Icon(Icons.add),
iconSize: 30.0,
color: Palette.facebookBlue,
o
ベストアンサー
