Skip to content

Commit f13ccc2

Browse files
committedMay 23, 2024·
commit
1 parent 127c41b commit f13ccc2

File tree

6 files changed

+194
-170
lines changed

6 files changed

+194
-170
lines changed
 

‎lib/main.dart

+1-1
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ class MyApp extends StatelessWidget {
3232
),
3333
],
3434
child: MaterialApp(
35-
title: "Instagram Clone",
35+
title: "Instagram Clone-naidu199",
3636
debugShowCheckedModeBanner: false,
3737
theme: ThemeData.dark().copyWith(
3838
scaffoldBackgroundColor: mobileBackgroundColor,

‎lib/responsive/mobilescreen_layout.dart

+79-77
Original file line numberDiff line numberDiff line change
@@ -39,86 +39,88 @@ class _MobileScreenLayoutState extends State<MobileScreenLayout> {
3939
@override
4040
Widget build(BuildContext context) {
4141
UserDetails userDetails = Provider.of<UserProvider>(context).getUser;
42-
return Scaffold(
43-
body: pages[_seletedIndex],
44-
bottomNavigationBar: BottomNavigationBar(
45-
type: BottomNavigationBarType.fixed,
46-
currentIndex: _seletedIndex,
47-
onTap: (index) {
48-
setState(() {
49-
_seletedIndex = index;
50-
});
51-
},
52-
backgroundColor: mobileBackgroundColor,
53-
showSelectedLabels: false,
54-
showUnselectedLabels: false,
55-
items: [
56-
BottomNavigationBarItem(
42+
return SafeArea(
43+
child: Scaffold(
44+
body: pages[_seletedIndex],
45+
bottomNavigationBar: BottomNavigationBar(
46+
type: BottomNavigationBarType.fixed,
47+
currentIndex: _seletedIndex,
48+
onTap: (index) {
49+
setState(() {
50+
_seletedIndex = index;
51+
});
52+
},
53+
backgroundColor: mobileBackgroundColor,
54+
showSelectedLabels: false,
55+
showUnselectedLabels: false,
56+
items: [
57+
BottomNavigationBarItem(
58+
backgroundColor: primaryColor,
59+
label: '',
60+
icon: Icon(
61+
_seletedIndex == 0 ? Icons.home_filled : Icons.home_outlined,
62+
color: _seletedIndex == 0 ? primaryColor : secondaryColor,
63+
// color: primaryColor,
64+
size: 32,
65+
)),
66+
BottomNavigationBarItem(
67+
backgroundColor: primaryColor,
68+
label: '',
69+
icon: Icon(
70+
_seletedIndex == 1
71+
? Icons.search_outlined
72+
: Icons.search_rounded,
73+
color: _seletedIndex == 0 ? primaryColor : secondaryColor,
74+
size: 32,
75+
)),
76+
// BottomNavigationBarItem(
77+
// backgroundColor: primaryColor,
78+
// label: '',
79+
// icon: SvgPicture.asset(
80+
// 'assets/search-line-icon.svg',
81+
// color: _seletedIndex == 1 ? primaryColor : secondaryColor,
82+
// height: 32,
83+
// width: 32,
84+
// )),
85+
BottomNavigationBarItem(
86+
backgroundColor: primaryColor,
87+
label: '',
88+
icon: SvgPicture.asset(
89+
'assets/add-square-outline.svg', //TODO add box sharp icon
90+
color: _seletedIndex == 2 ? primaryColor : secondaryColor,
91+
height: 32,
92+
width: 32,
93+
)),
94+
BottomNavigationBarItem(
95+
backgroundColor: primaryColor,
96+
label: '',
97+
icon: SvgPicture.asset(
98+
'assets/instagram-reels-icon.svg',
99+
color: _seletedIndex == 3 ? primaryColor : secondaryColor,
100+
height: 32,
101+
width: 32,
102+
)),
103+
BottomNavigationBarItem(
57104
backgroundColor: primaryColor,
58105
label: '',
59-
icon: Icon(
60-
_seletedIndex == 0 ? Icons.home_filled : Icons.home_outlined,
61-
color: _seletedIndex == 0 ? primaryColor : secondaryColor,
62-
// color: primaryColor,
63-
size: 32,
64-
)),
65-
BottomNavigationBarItem(
66-
backgroundColor: primaryColor,
67-
label: '',
68-
icon: Icon(
69-
_seletedIndex == 1
70-
? Icons.search_outlined
71-
: Icons.search_rounded,
72-
color: _seletedIndex == 0 ? primaryColor : secondaryColor,
73-
size: 32,
74-
)),
75-
// BottomNavigationBarItem(
76-
// backgroundColor: primaryColor,
77-
// label: '',
78-
// icon: SvgPicture.asset(
79-
// 'assets/search-line-icon.svg',
80-
// color: _seletedIndex == 1 ? primaryColor : secondaryColor,
81-
// height: 32,
82-
// width: 32,
83-
// )),
84-
BottomNavigationBarItem(
85-
backgroundColor: primaryColor,
86-
label: '',
87-
icon: SvgPicture.asset(
88-
'assets/add-square-outline.svg', //TODO add box sharp icon
89-
color: _seletedIndex == 2 ? primaryColor : secondaryColor,
90-
height: 32,
91-
width: 32,
92-
)),
93-
BottomNavigationBarItem(
94-
backgroundColor: primaryColor,
95-
label: '',
96-
icon: SvgPicture.asset(
97-
'assets/instagram-reels-icon.svg',
98-
color: _seletedIndex == 3 ? primaryColor : secondaryColor,
99-
height: 32,
100-
width: 32,
101-
)),
102-
BottomNavigationBarItem(
103-
backgroundColor: primaryColor,
104-
label: '',
105-
icon: Container(
106-
height: 35,
107-
width: 35,
108-
decoration: BoxDecoration(
109-
border: Border.all(
110-
color: _seletedIndex == 4
111-
? primaryColor
112-
: const Color.fromARGB(255, 122, 118, 118),
113-
),
114-
color: primaryColor,
115-
shape: BoxShape.circle),
116-
child: CircleAvatar(
117-
backgroundImage: NetworkImage(userDetails.profileUrl),
106+
icon: Container(
107+
height: 35,
108+
width: 35,
109+
decoration: BoxDecoration(
110+
border: Border.all(
111+
color: _seletedIndex == 4
112+
? primaryColor
113+
: const Color.fromARGB(255, 122, 118, 118),
114+
),
115+
color: primaryColor,
116+
shape: BoxShape.circle),
117+
child: CircleAvatar(
118+
backgroundImage: NetworkImage(userDetails.profileUrl),
119+
),
118120
),
119-
),
120-
)
121-
],
121+
)
122+
],
123+
),
122124
),
123125
);
124126
}

‎lib/responsive/responsive_layout.dart

+2-4
Original file line numberDiff line numberDiff line change
@@ -28,16 +28,14 @@ class _ResponsiveLayoutState extends State<ResponsiveLayout> {
2828
setState(() {
2929
isloading = true;
3030
});
31-
await Future.delayed(const Duration(seconds: 4));
31+
await Future.delayed(const Duration(seconds: 2));
3232
UserProvider userProvider = Provider.of(context, listen: false);
3333
await userProvider.refreshUserDetails();
3434
if (mounted) {
3535
setState(() {
3636
isloading = false;
3737
});
3838
}
39-
// print(3);
40-
// print(userProvider.getUser.profileUrl);
4139
}
4240

4341
@override
@@ -73,7 +71,7 @@ class _ResponsiveLayoutState extends State<ResponsiveLayout> {
7371
gradient: LinearGradient(colors: [Colors.red, Colors.blue]),
7472
),
7573
const SizedBox(
76-
height: 15,
74+
height: 20,
7775
)
7876
],
7977
),

‎lib/screens/feed_screen.dart

+35-23
Original file line numberDiff line numberDiff line change
@@ -11,33 +11,45 @@ class FeedScreen extends StatelessWidget {
1111
@override
1212
Widget build(BuildContext context) {
1313
return Scaffold(
14-
appBar: AppBar(
15-
backgroundColor: mobileBackgroundColor,
16-
centerTitle: false,
17-
title: SvgPicture.asset(
18-
'assets/ic_instagram.svg',
19-
color: primaryColor,
20-
height: 32,
21-
),
22-
actions: [
23-
IconButton(
24-
onPressed: () {},
25-
icon: const Icon(
26-
Icons.favorite_border,
27-
size: 32,
28-
)),
29-
IconButton(
30-
onPressed: () {},
31-
icon: SvgPicture.asset(
32-
'assets/instagram-share-icon (1).svg',
33-
height: 25,
34-
// width: 30,
14+
body: NestedScrollView(
15+
floatHeaderSlivers: true,
16+
body: const PostFeed(),
17+
headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) =>
18+
[
19+
SliverAppBar(
20+
floating: true,
21+
leading: const Icon(
22+
Icons.camera_alt_outlined,
23+
size: 32,
3524
color: primaryColor,
3625
),
37-
)
26+
backgroundColor: mobileBackgroundColor,
27+
centerTitle: true,
28+
title: SvgPicture.asset(
29+
'assets/ic_instagram.svg',
30+
color: primaryColor,
31+
height: 32,
32+
),
33+
actions: [
34+
IconButton(
35+
onPressed: () {},
36+
icon: const Icon(
37+
Icons.favorite_border,
38+
size: 32,
39+
)),
40+
IconButton(
41+
onPressed: () {},
42+
icon: SvgPicture.asset(
43+
'assets/instagram-share-icon (1).svg',
44+
height: 25,
45+
// width: 30,
46+
color: primaryColor,
47+
),
48+
)
49+
],
50+
),
3851
],
3952
),
40-
body: const PostFeed(),
4153
);
4254
}
4355
}

‎lib/screens/reels_screen.dart

+51-46
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import 'package:flutter/widgets.dart';
44
import 'package:instagram_clone/model/reel.dart';
55
// import 'package:instagram_clone/model/reel.dart';
66
import 'package:instagram_clone/utils/colors.dart';
7+
import 'package:instagram_clone/utils/global_consts.dart';
78
import 'package:instagram_clone/widgets/reel_details.dart';
89
import 'package:instagram_clone/widgets/reels_action_bar.dart';
910
import 'package:instagram_clone/widgets/video_player.dart';
@@ -18,6 +19,7 @@ class ReelsScreen extends StatefulWidget {
1819
class _ReelsScreenState extends State<ReelsScreen> {
1920
@override
2021
Widget build(BuildContext context) {
22+
final width = MediaQuery.of(context).size.width;
2123
return Scaffold(
2224
extendBodyBehindAppBar: true,
2325
backgroundColor: mobileBackgroundColor,
@@ -46,52 +48,55 @@ class _ReelsScreenState extends State<ReelsScreen> {
4648
scrollDirection: Axis.vertical,
4749
itemCount: dummyReels.length,
4850
itemBuilder: (context, index) {
49-
return Container(
50-
decoration: BoxDecoration(
51-
border: Border.all(color: mobileBackgroundColor),
52-
image: DecorationImage(
53-
fit: BoxFit.fitHeight,
54-
image: NetworkImage(
55-
'https://source.unsplash.com/random?sig=$index'))),
56-
child: Center(
57-
child: Stack(
58-
children: [
59-
// VideoPlayerWidget(url: 'url'),
60-
Container(
61-
decoration: BoxDecoration(
62-
gradient: LinearGradient(
63-
colors: [
64-
Colors.black.withOpacity(0.2),
65-
Colors.transparent
66-
],
67-
begin: const Alignment(0, -0.75),
68-
end: const Alignment(0, 0.1),
69-
),
70-
),
71-
),
72-
Column(
73-
mainAxisAlignment: MainAxisAlignment.end,
74-
children: [
75-
Row(
76-
crossAxisAlignment: CrossAxisAlignment.end,
77-
children: [
78-
Flexible(
79-
flex: 12,
80-
child: ReelDetails(
81-
// reel: dummyReels[index],
82-
),
83-
),
84-
Flexible(
85-
flex: 2,
86-
child: ReelsActionBar(
87-
// reel: dummyReels[index],
88-
),
89-
)
90-
],
91-
)
92-
],
93-
)
94-
],
51+
return Center(
52+
child: Container(
53+
width: width > webscreensize ? 400 : width,
54+
decoration: BoxDecoration(
55+
border: Border.all(color: mobileBackgroundColor),
56+
image: DecorationImage(
57+
fit: BoxFit.fitHeight,
58+
image: NetworkImage(
59+
'https://source.unsplash.com/random?sig=$index'))),
60+
child: const Center(
61+
child: Stack(
62+
children: [
63+
// VideoPlayerWidget(url: 'url'),
64+
// Container(
65+
// decoration: BoxDecoration(
66+
// gradient: LinearGradient(
67+
// colors: [
68+
// Colors.black.withOpacity(0.2),
69+
// Colors.transparent
70+
// ],
71+
// begin: const Alignment(0, -0.75),
72+
// end: const Alignment(0, 0.1),
73+
// ),
74+
// ),
75+
// ),
76+
const Column(
77+
mainAxisAlignment: MainAxisAlignment.end,
78+
children: [
79+
Row(
80+
crossAxisAlignment: CrossAxisAlignment.end,
81+
children: [
82+
Flexible(
83+
flex: 12,
84+
child: ReelDetails(
85+
// reel: dummyReels[index],
86+
),
87+
),
88+
Flexible(
89+
flex: 2,
90+
child: ReelsActionBar(
91+
// reel: dummyReels[index],
92+
),
93+
)
94+
],
95+
)
96+
],
97+
)
98+
],
99+
),
95100
),
96101
),
97102
);

‎lib/widgets/post_card.dart

+26-19
Original file line numberDiff line numberDiff line change
@@ -112,31 +112,38 @@ class _PostCardState extends State<PostCard> {
112112
),
113113
)),
114114
),
115+
const Spacer(),
115116
IconButton(
116117
onPressed: () {
117118
showDialog(
118119
context: context,
119120
builder: (context) {
120121
return Dialog(
121-
child: ListView(
122-
padding:
123-
const EdgeInsets.symmetric(vertical: 16),
124-
shrinkWrap: true,
125-
children: ['Delete']
126-
.map((e) => InkWell(
127-
onTap: () async {
128-
FireStorePostStorage().deletePost(
129-
widget.snapshot['postId'],
130-
context);
131-
Navigator.of(context).pop();
132-
},
133-
child: Container(
134-
padding: const EdgeInsets.symmetric(
135-
vertical: 12, horizontal: 16),
136-
child: Text(e),
137-
),
138-
))
139-
.toList(),
122+
child: SizedBox(
123+
width: 250,
124+
child: ListView(
125+
padding:
126+
const EdgeInsets.symmetric(vertical: 16),
127+
shrinkWrap: true,
128+
children: ['Delete']
129+
.map((e) => InkWell(
130+
onTap: () async {
131+
FireStorePostStorage().deletePost(
132+
widget.snapshot['postId'],
133+
context);
134+
Navigator.of(context).pop();
135+
},
136+
child: Container(
137+
width: 200,
138+
padding:
139+
const EdgeInsets.symmetric(
140+
vertical: 12,
141+
horizontal: 16),
142+
child: Text(e),
143+
),
144+
))
145+
.toList(),
146+
),
140147
),
141148
);
142149
});

0 commit comments

Comments
 (0)
Please sign in to comment.