~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.

Readme
|
Commits
|
Files
2a8a448c — pyrossh

2 years ago 
improve tab bar
Files changed (2) hide show
  1. bible_app/lib/components/book_selector.dart +77 -136
  2. bible_app/lib/screens/home.dart +1 -4
bible_app/lib/components/book_selector.dart CHANGED
@@ -1,160 +1,107 @@
1
+ import 'dart:io' show Platform;
1
2
  import "package:flutter/material.dart";
2
3
  import "package:flutter_reactive_value/flutter_reactive_value.dart";
3
4
  import "package:kannada_bible_app/screens/home.dart";
4
5
  import "../domain/book.dart";
5
6
  import "../domain/kannada_gen.dart";
6
7
 
7
- final tabIndex = ValueNotifier(0);
8
8
  final tabBookIndex = ValueNotifier(0);
9
9
 
10
10
  onTabBookChange(int i) {
11
- tabIndex.value = 1;
12
11
  tabBookIndex.value = i;
13
12
  }
14
13
 
15
- // class BookSelector extends StatelessWidget {
14
+ class BookSelector extends StatelessWidget {
16
- // const BookSelector({super.key});
17
- //
18
- // @override
19
- // Widget build(BuildContext context) {
20
- // final tab = tabIndex.reactiveValue(context);
21
- // if (tab == 1) {
22
- // final book = kannadaBible[tabBookIndex.reactiveValue(context)];
23
- // return Container(
24
- // // margin: const EdgeInsets.symmetric(vertical: 15, horizontal: 30),
25
- // color: Colors.white,
26
- // child: Column(
27
- // crossAxisAlignment: CrossAxisAlignment.start,
28
- // children: [
29
- // Container(
30
- // margin: const EdgeInsets.only(bottom: 10),
31
- // child: Text(book.name, style: Theme.of(context).textTheme.headlineMedium),
32
- // ),
33
- // const Expanded(child: ChaptersList()),
34
- // ],
35
- // ),
36
- // );
37
- // }
38
- // return Container(
39
- // // margin: const EdgeInsets.symmetric(vertical: 15, horizontal: 30),
40
- // color: Colors.white,
41
- // child: Column(
42
- // crossAxisAlignment: CrossAxisAlignment.start,
43
- // children: [
44
- // Container(
45
- // margin: const EdgeInsets.only(bottom: 10),
46
- // child: Text("Old Testament", style: Theme.of(context).textTheme.headlineMedium),
47
- // ),
48
- // Expanded(child: BooksList(offset: 0, books: oldTestament)),
49
- // Container(
50
- // margin: const EdgeInsets.symmetric(vertical: 15),
51
- // child: Text("New Testament", style: Theme.of(context).textTheme.headlineMedium),
52
- // ),
53
- // Expanded(child: BooksList(offset: 39, books: newTestament)),
54
- // ],
55
- // ),
56
- // );
57
- // }
58
- // }
59
-
60
- class MyTabbedPage extends StatefulWidget {
61
- const MyTabbedPage({super.key});
15
+ const BookSelector({super.key});
62
-
63
- @override
64
- State<MyTabbedPage> createState() => _MyTabbedPageState();
65
- }
66
-
67
- class _MyTabbedPageState extends State<MyTabbedPage> with SingleTickerProviderStateMixin {
68
- late TabController _tabController;
69
- int _selectedIndex = 0;
70
-
71
- @override
72
- void initState() {
73
- super.initState();
74
- _tabController = TabController(vsync: this, length: 2);
75
- }
76
-
77
- @override
78
- void dispose() {
79
- _tabController.dispose();
80
- super.dispose();
81
- }
82
16
 
83
17
  @override
84
18
  Widget build(BuildContext context) {
85
19
  final book = kannadaBible[tabBookIndex.reactiveValue(context)];
86
- onBookTap(i) {
20
+
87
- _tabController.animateTo(1);
88
- }
89
- return Scaffold(
21
+ return DefaultTabController(
90
- appBar: AppBar(
22
+ length: 2,
23
+ animationDuration: Platform.isMacOS ? Duration.zero: const Duration(milliseconds: 300),
91
- flexibleSpace: Column(
24
+ child: Column(
92
- mainAxisAlignment: MainAxisAlignment.end,
93
- children: [
25
+ children: [
26
+ SizedBox(
27
+ width: 250,
94
- TabBar(
28
+ child: TabBar(
95
- // overlayColor:
96
- indicatorWeight: 10,
97
- dividerColor: Colors.black,
29
+ labelPadding: EdgeInsets.zero,
98
30
  labelColor: Colors.black,
99
- labelStyle: TextStyle(
31
+ labelStyle: const TextStyle(
100
- fontSize: 22,
32
+ fontSize: 14,
101
33
  fontWeight: FontWeight.w600,
102
34
  ),
103
35
  indicator: BoxDecoration(
36
+ border: Border.all(color: Colors.blue.shade700, width: 3),
104
37
  borderRadius: BorderRadius.circular(50),
105
- color: Colors.greenAccent,
106
38
  ),
107
- controller: _tabController,
108
39
  tabs: const [
40
+ Tab(
41
+ child: Row(
42
+ mainAxisSize: MainAxisSize.min,
43
+ children: [
44
+ Icon(Icons.book_outlined, color: Colors.red, size: 24),
45
+ SizedBox(width: 8),
109
- Tab(text: 'Book'),
46
+ Text('BOOK'),
110
- Tab(text: 'Chapter'),
111
- ],
47
+ ],
112
- ),
48
+ ),
113
- ],
114
- ),
115
- ),
116
- body: TabBarView(
117
- controller: _tabController,
118
- children: [
119
- Container(
120
- // margin: const EdgeInsets.symmetric(vertical: 15, horizontal: 30),
121
- color: Colors.white,
122
- child: Column(
123
- crossAxisAlignment: CrossAxisAlignment.start,
124
- children: [
125
- Container(
126
- margin: const EdgeInsets.only(bottom: 10),
127
- child: Text("Old Testament", style: Theme
128
- .of(context)
129
- .textTheme
130
- .headlineMedium),
131
49
  ),
50
+ Tab(
51
+ child: Row(
52
+ mainAxisSize: MainAxisSize.min,
53
+ children: [
132
- Expanded(child: BooksList(offset: 0, books: oldTestament, onBookTap: onBookTap)),
54
+ Icon(Icons.bookmark_outline, color: Colors.blue, size: 24),
133
- Container(
134
- margin: const EdgeInsets.symmetric(vertical: 15),
135
- child: Text("New Testament", style: Theme
136
- .of(context)
137
- .textTheme
138
- .headlineMedium),
55
+ SizedBox(width: 8),
56
+ Text('CHAPTER'),
57
+ ],
58
+ ),
139
59
  ),
140
- Expanded(child: BooksList(offset: 39, books: newTestament, onBookTap: onBookTap)),
141
60
  ],
142
61
  ),
143
62
  ),
144
63
  Container(
145
- // margin: const EdgeInsets.symmetric(vertical: 15, horizontal: 30),
64
+ margin: const EdgeInsets.symmetric(vertical: 20),
146
- color: Colors.white,
65
+ decoration: const BoxDecoration(
66
+ border: Border(bottom: BorderSide(width: 1.5)),
67
+ ),
68
+ ),
69
+ Flexible(
147
- child: Column(
70
+ child: TabBarView(
148
- crossAxisAlignment: CrossAxisAlignment.start,
149
71
  children: [
150
72
  Container(
73
+ // margin: const EdgeInsets.symmetric(vertical: 15, horizontal: 30),
74
+ color: Colors.white,
75
+ child: Column(
76
+ crossAxisAlignment: CrossAxisAlignment.start,
77
+ children: [
78
+ Container(
151
- margin: const EdgeInsets.only(bottom: 10),
79
+ margin: const EdgeInsets.only(bottom: 10),
80
+ child: Text("Old Testament", style: Theme.of(context).textTheme.headlineMedium),
81
+ ),
82
+ Expanded(child: BooksList(offset: 0, books: oldTestament)),
83
+ Container(
84
+ margin: const EdgeInsets.symmetric(vertical: 15),
85
+ child: Text("New Testament", style: Theme.of(context).textTheme.headlineMedium),
86
+ ),
87
+ Expanded(child: BooksList(offset: 39, books: newTestament)),
88
+ ],
89
+ ),
90
+ ),
91
+ Container(
92
+ // margin: const EdgeInsets.symmetric(vertical: 15, horizontal: 30),
93
+ color: Colors.white,
94
+ child: Column(
95
+ crossAxisAlignment: CrossAxisAlignment.start,
96
+ children: [
97
+ Container(
98
+ margin: const EdgeInsets.only(bottom: 10),
152
- child: Text(book.name, style: Theme
99
+ child: Text(book.name, style: Theme.of(context).textTheme.headlineMedium),
153
- .of(context)
154
- .textTheme
100
+ ),
155
- .headlineMedium),
101
+ const Expanded(child: ChaptersList()),
102
+ ],
103
+ ),
156
104
  ),
157
- const Expanded(child: ChaptersList()),
158
105
  ],
159
106
  ),
160
107
  ),
@@ -167,9 +114,8 @@ class _MyTabbedPageState extends State<MyTabbedPage> with SingleTickerProviderSt
167
114
  class BooksList extends StatelessWidget {
168
115
  final int offset;
169
116
  final List<String> books;
170
- final Function(int) onBookTap;
171
117
 
172
- const BooksList({super.key, required this.offset, required this.books, required this.onBookTap});
118
+ const BooksList({super.key, required this.offset, required this.books});
173
119
 
174
120
  @override
175
121
  Widget build(BuildContext context) {
@@ -181,7 +127,8 @@ class BooksList extends StatelessWidget {
181
127
  final name = books[index].replaceAll(" ", "").substring(0, 3).toUpperCase();
182
128
  return InkWell(
183
129
  onTap: () {
130
+ DefaultTabController.of(context).animateTo(1);
184
- onBookTap(offset + index);
131
+ tabBookIndex.value = offset + index;
185
132
  },
186
133
  child: Container(
187
134
  margin: const EdgeInsets.all(3),
@@ -192,10 +139,7 @@ class BooksList extends StatelessWidget {
192
139
  child: Text(
193
140
  name,
194
141
  textAlign: TextAlign.center,
195
- style: Theme
196
- .of(context)
197
- .textTheme
198
- .labelMedium,
142
+ style: Theme.of(context).textTheme.labelMedium,
199
143
  ),
200
144
  ),
201
145
  ),
@@ -232,10 +176,7 @@ class ChaptersList extends StatelessWidget {
232
176
  child: Text(
233
177
  "${index + 1}",
234
178
  textAlign: TextAlign.center,
235
- style: Theme
236
- .of(context)
237
- .textTheme
238
- .labelMedium,
179
+ style: Theme.of(context).textTheme.labelMedium,
239
180
  ),
240
181
  ),
241
182
  ),
bible_app/lib/screens/home.dart CHANGED
@@ -56,9 +56,6 @@ class HomeScreenRoute extends GoRouteData {
56
56
  )
57
57
  @immutable
58
58
  class SelectScreenRoute extends GoRouteData {
59
- SelectScreenRoute() {
60
- tabIndex.value = 0;
61
- }
62
59
 
63
60
  @override
64
61
  Page buildPage(BuildContext context, GoRouterState state) {
@@ -69,7 +66,7 @@ class SelectScreenRoute extends GoRouteData {
69
66
  Flexible(
70
67
  child: Container(
71
68
  margin: const EdgeInsets.only(left: 40, top: 20, right: 300),
72
- child: const MyTabbedPage(),
69
+ child: const BookSelector(),
73
70
  ),
74
71
  ),
75
72
  ],