Skip to content

Commit

Permalink
Add saloman bottom bar and modal bottom sheet
Browse files Browse the repository at this point in the history
  • Loading branch information
@prateekmedia
prateekmedia committed Aug 31, 2021
1 parent 180de3d commit c90c474
Show file tree
Hide file tree
Showing 8 changed files with 104 additions and 268 deletions.
39 changes: 16 additions & 23 deletions lib/main.dart
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import 'package:flutter/material.dart';
import 'package:flutube/screens/screens.dart';
import 'package:flutube/utils/utils.dart';
import 'package:google_nav_bar/google_nav_bar.dart';
import 'package:salomon_bottom_bar/salomon_bottom_bar.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:ionicons/ionicons.dart';

Expand Down Expand Up @@ -155,32 +155,25 @@ class MyHomePage extends HookWidget {
shape: const StadiumBorder(),
color: Colors.grey[900]!,
),
child: GNav(
rippleColor: Colors.grey[300]!,
hoverColor: Colors.grey[100]!,
gap: 8,
activeColor: Colors.white,
iconSize: 24,
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 12),
duration: const Duration(milliseconds: 400),
tabBackgroundColor: Theme.of(context).primaryColor,
color: Colors.grey,
tabs: const [
GButton(
text: "Home",
icon: Ionicons.home,
child: SalomonBottomBar(
selectedItemColor: Colors.white,
unselectedItemColor: Colors.grey,
items: [
SalomonBottomBarItem(
title: const Text("Home"),
icon: const Icon(Ionicons.home),
),
GButton(
text: "Downloads",
icon: Ionicons.download_outline,
SalomonBottomBarItem(
title: const Text("Downloads"),
icon: const Icon(Ionicons.download_outline),
),
GButton(
text: "Settings",
icon: Ionicons.settings_sharp,
SalomonBottomBarItem(
title: const Text("Settings"),
icon: const Icon(Ionicons.settings_sharp),
),
],
selectedIndex: _currentIndex.value,
onTabChange: (index) => _controller.animateToPage(index,
currentIndex: _currentIndex.value,
onTap: (index) => _controller.animateToPage(index,
duration: const Duration(milliseconds: 300),
curve: Curves.fastOutSlowIn),
),
Expand Down
12 changes: 9 additions & 3 deletions lib/screens/channel_screen.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,15 +56,21 @@ class ChannelScreen extends HookWidget {
),
itemCount: snapshot.data!.length,
)
: const CircularProgressIndicator().center();
: getCircularProgressIndicator();
},
),
)
] else
SliverToBoxAdapter(
child: const CircularProgressIndicator().center()),
SliverToBoxAdapter(child: getCircularProgressIndicator()),
],
),
);
}

Widget getCircularProgressIndicator() {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 25),
child: const CircularProgressIndicator().center(),
);
}
}
44 changes: 20 additions & 24 deletions lib/screens/video_screen.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:flutube/widgets/widgets.dart';
import 'package:ionicons/ionicons.dart';
import 'package:modal_bottom_sheet/modal_bottom_sheet.dart';
import 'package:timeago/timeago.dart' as timeago;
import 'package:share_plus/share_plus.dart';
import 'package:youtube_explode_dart/youtube_explode_dart.dart';
Expand Down Expand Up @@ -67,9 +68,8 @@ class VideoScreen extends HookWidget {
GestureDetector(
onTap: context.width < mobileWidth
? () {
showPopover(
context,
isScrollControlled: false,
showMaterialModalBottomSheet(
context: context,
builder: (ctx) =>
DescriptionWidget(videoData: videoData),
);
Expand Down Expand Up @@ -171,9 +171,8 @@ class VideoScreen extends HookWidget {
: currentItem.value == 1
? () => currentItem.value = 0
: context.width < mobileWidth
? () => showPopover(
context,
isScrollable: false,
? () => showMaterialModalBottomSheet(
context: context,
builder: (ctx) {
return Expanded(
child: CommentsWidget(
Expand Down Expand Up @@ -331,27 +330,24 @@ class DescriptionWidget extends StatelessWidget {

@override
Widget build(BuildContext context) {
return SingleChildScrollView(
return ListView(
controller: ScrollController(),
padding: const EdgeInsets.symmetric(horizontal: 12),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Description",
style: context.textTheme.bodyText2!.copyWith(
fontWeight: FontWeight.bold, fontSize: isInsidePopup ? 15 : 18),
),
const SizedBox(height: 15),
Container(
padding: const EdgeInsets.symmetric(vertical: 4),
child: SelectableText(
videoData.description,
style: TextStyle(fontSize: isInsidePopup ? 16 : 17),
),
children: [
Text(
"Description",
style: context.textTheme.bodyText2!.copyWith(
fontWeight: FontWeight.bold, fontSize: isInsidePopup ? 15 : 18),
),
const SizedBox(height: 15),
Container(
padding: const EdgeInsets.symmetric(vertical: 4),
child: SelectableText(
videoData.description,
style: TextStyle(fontSize: isInsidePopup ? 16 : 17),
),
],
),
),
],
);
}
}
Expand Down
74 changes: 43 additions & 31 deletions lib/utils/show_download_popover.dart
View file
Original file line number Diff line number Diff line change
@@ -1,41 +1,53 @@
import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:flutube/widgets/widgets.dart';
import 'package:ionicons/ionicons.dart';
import 'package:modal_bottom_sheet/modal_bottom_sheet.dart';
import 'package:youtube_explode_dart/youtube_explode_dart.dart';
import 'utils.dart';

Future showDownloadPopup(BuildContext context, Video video) {
return showPopover(context, builder: (ctx) {
return FutureBuilder<StreamManifest>(
future:
YoutubeExplode().videos.streamsClient.getManifest(video.id.value),
builder: (context, snapshot) {
return snapshot.hasData
? Column(
children: [
const SizedBox(height: 6),
linksHeader(icon: Ionicons.musical_note, label: "Audio"),
const SizedBox(height: 14),
for (var audioStream
in snapshot.data!.audioOnly.toList().reversed)
customListTile(audioStream, video.title),
const SizedBox(height: 14),
linksHeader(icon: Ionicons.videocam, label: "Video"),
const SizedBox(height: 14),
for (var videoStream in snapshot.data!.video
.where((element) => element.tag < 100)
.toList()
.sortByVideoQuality())
customListTile(videoStream, video.title),
],
)
: const SizedBox(
height: 100,
child: Center(child: CircularProgressIndicator()),
);
});
});
return showBarModalBottomSheet(
context: context,
builder: (ctx) {
return Material(
child: Padding(
padding: const EdgeInsets.all(20.0),
child: FutureBuilder<StreamManifest>(
future: YoutubeExplode()
.videos
.streamsClient
.getManifest(video.id.value),
builder: (context, snapshot) {
return snapshot.hasData
? Column(
mainAxisSize: MainAxisSize.min,
children: [
const SizedBox(height: 6),
linksHeader(
icon: Ionicons.musical_note, label: "Audio"),
const SizedBox(height: 14),
for (var audioStream
in snapshot.data!.audioOnly.toList().reversed)
customListTile(audioStream, video.title),
const SizedBox(height: 14),
linksHeader(
icon: Ionicons.videocam, label: "Video"),
const SizedBox(height: 14),
for (var videoStream in snapshot.data!.video
.where((element) => element.tag < 100)
.toList()
.sortByVideoQuality())
customListTile(videoStream, video.title),
],
)
: const SizedBox(
height: 100,
child: Center(child: CircularProgressIndicator()),
);
}),
),
);
});
}

Widget linksHeader({required IconData icon, required String label}) {
Expand Down
Loading

0 comments on commit c90c474

Please sign in to comment.