~repos /only-bible-app

#kotlin#android#ios

git clone https://pyrossh.dev/repos/only-bible-app.git

The only bible app you will ever need. No ads. No in-app purchases. No distractions.


e62ed14c pyrossh

2 years ago
improve mobile appBar
lib/screens/chapter_view_screen.dart CHANGED
@@ -1,5 +1,6 @@
1
1
  import "package:flutter/material.dart";
2
2
  import "package:flutter_swipe_detector/flutter_swipe_detector.dart";
3
+ import "package:only_bible_app/widgets/chapter_app_bar.dart";
3
4
  import "package:only_bible_app/widgets/header.dart";
4
5
  import "package:only_bible_app/state.dart";
5
6
  import "package:only_bible_app/widgets/sidebar.dart";
@@ -31,6 +32,7 @@ class ChapterViewScreen extends StatelessWidget {
31
32
  // );
32
33
  // },
33
34
  // ),
35
+ final isDesktop = isWide(context);
34
36
  final model = ChapterViewModel(
35
37
  book: book,
36
38
  chapter: chapter,
@@ -39,8 +41,8 @@ class ChapterViewScreen extends StatelessWidget {
39
41
  return ChangeNotifierProvider.value(
40
42
  value: model,
41
43
  child: Scaffold(
44
+ appBar: isDesktop ? null : const ChapterAppBar(),
42
45
  backgroundColor: Theme.of(context).colorScheme.background,
43
- // bottomSheet: const ActionsBar(),
44
46
  body: SafeArea(
45
47
  child: SwipeDetector(
46
48
  onSwipeLeft: (offset) {
@@ -49,25 +51,27 @@ class ChapterViewScreen extends StatelessWidget {
49
51
  onSwipeRight: (offset) {
50
52
  model.onPrevious(context, book, chapter);
51
53
  },
52
- child: Row(
53
- children: [
54
- if (isWide(context)) const Sidebar(),
55
- const Flexible(
56
- child: Column(
54
+ child: isDesktop
55
+ ? const Row(
57
56
  children: [
58
- Header(),
57
+ Sidebar(),
59
58
  Flexible(
59
+ child: Column(
60
+ children: [
61
+ Header(),
62
+ Flexible(
60
- child: VerseList(),
63
+ child: VerseList(),
64
+ ),
65
+ // TODO: add padding only if bottom sheet is shown
66
+ // Padding(
67
+ // padding: EdgeInsets.only(bottom: 40),
68
+ // )
69
+ ],
70
+ ),
61
71
  ),
62
- // TODO: add padding only if bottom sheet is shown
63
- // Padding(
64
- // padding: EdgeInsets.only(bottom: 40),
65
- // )
66
72
  ],
67
- ),
73
+ )
68
- ),
74
+ : const VerseList(),
69
- ],
70
- ),
71
75
  ),
72
76
  ),
73
77
  ),
lib/theme.dart CHANGED
@@ -12,6 +12,12 @@ final lightTheme = ThemeData(
12
12
  hoverColor: const Color(0xAAF8D0DC),
13
13
  dividerColor: Colors.black,
14
14
  shadowColor: Colors.black,
15
+ appBarTheme: const AppBarTheme(
16
+ backgroundColor: Colors.white,
17
+ toolbarHeight: 30,
18
+ elevation: 0,
19
+ scrolledUnderElevation: 0,
20
+ ),
15
21
  bottomSheetTheme: const BottomSheetThemeData(
16
22
  elevation: 10,
17
23
  shadowColor: Colors.black,
@@ -111,6 +117,9 @@ final darkTheme = ThemeData(
111
117
  hoverColor: const Color(0xAA5D4979),
112
118
  dividerColor: Colors.white,
113
119
  shadowColor: Colors.white,
120
+ appBarTheme: lightTheme.appBarTheme.copyWith(
121
+ backgroundColor: const Color(0xFF1F1F22),
122
+ ),
114
123
  bottomSheetTheme: const BottomSheetThemeData(
115
124
  elevation: 1,
116
125
  shape: Border(
lib/widgets/chapter_app_bar.dart ADDED
@@ -0,0 +1,61 @@
1
+ import "package:flutter/material.dart";
2
+ import "package:only_bible_app/screens/book_select_screen.dart";
3
+ import "package:only_bible_app/state.dart";
4
+ import "package:only_bible_app/widgets/menu.dart";
5
+
6
+ class ChapterAppBar extends StatelessWidget implements PreferredSizeWidget {
7
+ const ChapterAppBar({super.key});
8
+
9
+ @override
10
+ Size get preferredSize => const Size.fromHeight(30);
11
+
12
+ @override
13
+ Widget build(BuildContext context) {
14
+ final selectedBible = AppModel.of(context).bible;
15
+ final model = ChapterViewModel.of(context);
16
+ final selectedBook = selectedBible.books[model.book];
17
+ final bookName = selectedBook.name;
18
+ return AppBar(
19
+ excludeHeaderSemantics: true,
20
+ // bottom: const PreferredSize(
21
+ // preferredSize: Size.fromHeight(1),
22
+ // child: Divider(height: 0, thickness: 1, indent: 18, endIndent: 20),
23
+ // ),
24
+ title: TextButton.icon(
25
+ style: TextButton.styleFrom(
26
+ padding: EdgeInsets.zero,
27
+ backgroundColor: Theme.of(context).colorScheme.background,
28
+ elevation: 0,
29
+ ),
30
+ label: Icon(
31
+ Icons.expand_more,
32
+ size: 28,
33
+ color: Theme.of(context).textTheme.headlineMedium!.color,
34
+ ),
35
+ icon: Text(
36
+ "$bookName ${model.chapter + 1}",
37
+ style: Theme.of(context).textTheme.headlineMedium,
38
+ ),
39
+ onPressed: () {
40
+ Navigator.of(context).push(
41
+ createNoTransitionPageRoute(
42
+ BookSelectScreen(bible: selectedBible),
43
+ ),
44
+ );
45
+ },
46
+ ),
47
+ centerTitle: false,
48
+ surfaceTintColor: Colors.white,
49
+ leading: null,
50
+ automaticallyImplyLeading: false,
51
+ actions: const [
52
+ Menu(),
53
+ // IconButton(
54
+ // padding: EdgeInsets.zero,
55
+ // onPressed: () {},
56
+ // icon: const Icon(Icons.more_vert),
57
+ // ),
58
+ ],
59
+ );
60
+ }
61
+ }
lib/widgets/header.dart CHANGED
@@ -13,8 +13,8 @@ class Header extends StatelessWidget {
13
13
  final selectedBible = AppModel.of(context).bible;
14
14
  final model = ChapterViewModel.of(context);
15
15
  final selectedBook = selectedBible.books[model.book];
16
- final isDesktop = isWide(context);
17
16
  final bookName = selectedBook.name;
17
+ final isDesktop = isWide(context);
18
18
  // Localizations.localeOf(context).languageCode
19
19
  return Container(
20
20
  padding: EdgeInsets.only(
lib/widgets/menu.dart CHANGED
@@ -12,8 +12,9 @@ class Menu extends StatelessWidget {
12
12
  final modeIcon = model.darkMode ? Icons.dark_mode : Icons.light_mode;
13
13
  final boldColor = model.fontBold ? Theme.of(context).shadowColor : Colors.grey;
14
14
  return PopupMenuButton(
15
+ padding: EdgeInsets.zero,
15
- icon: const Icon(Icons.more_vert, size: 28),
16
+ icon: Icon(Icons.more_vert, size: isDesktop ? 28 : 22),
16
- offset: const Offset(0.0, 50),
17
+ offset: Offset(0.0, isDesktop ? 60 : 30),
17
18
  onSelected: (int v) {
18
19
  if (v == 1) {
19
20
  Navigator.of(context).push(