Skip to content

Commit

Permalink
improve ui
Browse files Browse the repository at this point in the history
  • Loading branch information
pyrossh committed Aug 16, 2023
1 parent 346903a commit e31681b
Show file tree
Hide file tree
Showing 5 changed files with 168 additions and 148 deletions.
9 changes: 6 additions & 3 deletions lib/state.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -144,9 +144,11 @@ class AppModel extends ChangeNotifier {
}

hideActions(BuildContext context) {
actionsShown = false;
Navigator.of(context).pop();
notifyListeners();
if (actionsShown) {
actionsShown = false;
Navigator.of(context).pop();
notifyListeners();
}
}
}

Expand Down Expand Up @@ -186,6 +188,7 @@ class ChapterViewModel extends ChangeNotifier {
}

navigateBookChapter(BuildContext context, int book, int chapter, TextDirection? dir) {
AppModel.ofEvent(context).hideActions(context);
Navigator.of(context).push(
createSlideRoute(
context: context,
Expand Down
1 change: 0 additions & 1 deletion lib/theme.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@ final lightTheme = ThemeData(
// ),
appBarTheme: const AppBarTheme(
backgroundColor: Colors.white,
toolbarHeight: 30,
elevation: 0,
scrolledUnderElevation: 0,
),
Expand Down
64 changes: 33 additions & 31 deletions lib/widgets/chapter_app_bar.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,46 +7,48 @@ class ChapterAppBar extends StatelessWidget implements PreferredSizeWidget {
const ChapterAppBar({super.key});

@override
Size get preferredSize => const Size.fromHeight(30);
Size get preferredSize => const Size.fromHeight(40);

@override
Widget build(BuildContext context) {
final selectedBible = AppModel.of(context).bible;
final model = ChapterViewModel.of(context);
final selectedBook = selectedBible.books[model.book];
final bookName = selectedBook.name;
return AppBar(
excludeHeaderSemantics: true,
title: TextButton.icon(
style: TextButton.styleFrom(
padding: EdgeInsets.zero,
backgroundColor: Theme.of(context).colorScheme.background,
elevation: 0,
),
label: Icon(
Icons.expand_more,
size: 28,
color: Theme.of(context).textTheme.headlineMedium!.color,
),
icon: Text(
"$bookName ${model.chapter + 1}",
style: Theme.of(context).textTheme.headlineMedium,
),
onPressed: () {
Navigator.of(context).push(
createNoTransitionPageRoute(
BookSelectScreen(bible: selectedBible),
return SafeArea(
child: Padding(
padding: const EdgeInsets.only(left: 18, right: 5, bottom: 0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
InkWell(
enableFeedback: true,
onTap: () {
Navigator.of(context).push(
createNoTransitionPageRoute(
BookSelectScreen(bible: selectedBible),
),
);
},
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Text(
"$bookName ${model.chapter + 1}",
style: Theme.of(context).textTheme.headlineMedium,
),
Icon(
Icons.expand_more,
size: 28,
color: Theme.of(context).textTheme.headlineMedium!.color,
),
],
),
),
);
},
const MoreButton(),
],
),
),
centerTitle: false,
surfaceTintColor: Colors.white,
leading: null,
automaticallyImplyLeading: false,
actions: const [
MoreButton(),
],
);
}
}
144 changes: 75 additions & 69 deletions lib/widgets/settings_sheet.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,80 +13,86 @@ class SettingsSheet extends StatelessWidget {
final modeIcon = model.darkMode ? Icons.dark_mode : Icons.light_mode;
final modeIconColor = model.darkMode ? const Color(0xFF59EEFF) : const Color(0xFFE5B347);
final iconColor = Theme.of(context).textTheme.bodyMedium!.color;
return SettingsList(
contentPadding: EdgeInsets.zero,
platform: DevicePlatform.iOS,
lightTheme: const SettingsThemeData(
settingsListBackground: Color(0xFFF2F2F7),
),
darkTheme: const SettingsThemeData(
settingsListBackground: Color(0xFF141415),
),
sections: [
SettingsSection(
margin: const EdgeInsetsDirectional.symmetric(horizontal: 20),
title: Container(
alignment: Alignment.topLeft,
child: const Text(
"Settings",
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w500,
),
return Column(
children: [
const Padding(
padding: EdgeInsets.only(bottom: 15),
child: Text(
"Settings",
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w500,
),
),
tiles: [
SettingsTile.navigation(
leading: const Icon(Icons.language, color: Colors.green),
title: const Text("Language"),
value: const Text("English"),
),
SettingsTile.navigation(
leading: const Icon(Icons.book_outlined, color: Colors.blueAccent),
title: const Text("Bible"),
value: Text(selectedBible.name),
onPressed: (c) {
Navigator.of(c).pushReplacement(
createNoTransitionPageRoute(
const BibleSelectScreen(),
),
);
return null;
},
),
SettingsTile.switchTile(
onToggle: (value) {
model.toggleMode();
},
initialValue: model.darkMode,
leading: Icon(modeIcon, color: modeIconColor),
title: const Text("Dark mode"),
),
SettingsTile.switchTile(
onToggle: (value) {
model.toggleBold();
},
initialValue: model.fontBold,
leading: Icon(Icons.format_bold, color: iconColor),
title: const Text("Bold font"),
),
Expanded(
child: SettingsList(
contentPadding: EdgeInsets.zero,
platform: DevicePlatform.iOS,
lightTheme: const SettingsThemeData(
settingsListBackground: Color(0xFFF2F2F7),
),
SettingsTile(
title: const Text("Increase font size"),
leading: Icon(Icons.font_download, color: iconColor),
trailing: IconButton(
onPressed: model.increaseFont,
icon: const Icon(Icons.add_circle_outline, size: 32, color: Colors.redAccent),
),
darkTheme: const SettingsThemeData(
settingsListBackground: Color(0xFF141415),
),
SettingsTile(
title: const Text("Decrease font size"),
leading: Icon(Icons.font_download, color: iconColor),
trailing: IconButton(
onPressed: model.decreaseFont,
icon: const Icon(Icons.remove_circle_outline, size: 32, color: Colors.blueAccent),
sections: [
SettingsSection(
margin: const EdgeInsetsDirectional.symmetric(horizontal: 20),
tiles: [
SettingsTile.navigation(
leading: const Icon(Icons.language, color: Colors.green),
title: const Text("Language"),
value: const Text("English"),
),
SettingsTile.navigation(
leading: const Icon(Icons.book_outlined, color: Colors.blueAccent),
title: const Text("Bible"),
value: Text(selectedBible.name),
onPressed: (c) {
Navigator.of(c).pushReplacement(
createNoTransitionPageRoute(
const BibleSelectScreen(),
),
);
return null;
},
),
SettingsTile.switchTile(
onToggle: (value) {
model.toggleMode();
},
initialValue: model.darkMode,
leading: Icon(modeIcon, color: modeIconColor),
title: const Text("Dark mode"),
),
SettingsTile.switchTile(
onToggle: (value) {
model.toggleBold();
},
initialValue: model.fontBold,
leading: Icon(Icons.format_bold, color: iconColor),
title: const Text("Bold font"),
),
SettingsTile(
title: const Text("Increase font size"),
leading: Icon(Icons.font_download, color: iconColor),
trailing: IconButton(
onPressed: model.increaseFont,
icon: const Icon(Icons.add_circle_outline, size: 32, color: Colors.redAccent),
),
),
SettingsTile(
title: const Text("Decrease font size"),
leading: Icon(Icons.font_download, color: iconColor),
trailing: IconButton(
onPressed: model.decreaseFont,
icon: const Icon(Icons.remove_circle_outline, size: 32, color: Colors.blueAccent),
),
),
],
),
),
],
],
),
),
],
);
Expand Down
98 changes: 54 additions & 44 deletions lib/widgets/verses_view.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,52 +20,62 @@ class VersesView extends StatelessWidget {
model.onPrevious(context, model.book, model.chapter);
},
child: Padding(
padding: EdgeInsets.only(left: 20, right: 20, bottom: app.actionsShown ? 120 : 0),
padding: const EdgeInsets.only(left: 20, right: 20),
child: SingleChildScrollView(
physics: const BouncingScrollPhysics(),
child: Text.rich(
// scrollPhysics: const BouncingScrollPhysics(),
// contextMenuBuilder: null,
textScaleFactor: app.textScaleFactor,
// onSelectionChanged: (selection, _) {
// },
TextSpan(
style: app.fontBold
? textStyle.copyWith(
fontWeight: FontWeight.w500,
)
: textStyle,
// recognizer: TapAndPanGestureRecognizer()..onDragEnd = (e) => print("Hello"),
children: chapter.verses
.asMap()
.entries
.map(
(e) => [
WidgetSpan(
child: Transform.translate(
offset: const Offset(0, -2),
child: Text("${e.key + 1} ", style: Theme.of(context).textTheme.labelMedium),
),
),
TextSpan(
text: "${e.value.text}\n",
style: model.isVerseSelected(e.key)
? TextStyle(
backgroundColor: Theme.of(context).highlightColor,
)
: null,
recognizer: TapGestureRecognizer()..onTap = () => model.onVerseSelected(context, e.key),
),
const WidgetSpan(
child: Padding(
padding: EdgeInsets.only(top: 16, bottom: 16),
),
),
],
)
.expand((element) => element)
.toList(),
),
child: Column(
children: [
// const Padding(
// padding: EdgeInsets.only(top: 0),
// ),
Text.rich(
// scrollPhysics: const BouncingScrollPhysics(),
// contextMenuBuilder: null,
textScaleFactor: app.textScaleFactor,
// onSelectionChanged: (selection, _) {
// },
TextSpan(
style: app.fontBold
? textStyle.copyWith(
fontWeight: FontWeight.w500,
)
: textStyle,
// recognizer: TapAndPanGestureRecognizer()..onDragEnd = (e) => print("Hello"),
children: chapter.verses
.asMap()
.entries
.map(
(e) => [
WidgetSpan(
child: Transform.translate(
offset: const Offset(0, -2),
child: Text("${e.key + 1} ", style: Theme.of(context).textTheme.labelMedium),
),
),
TextSpan(
text: "${e.value.text}\n",
style: model.isVerseSelected(e.key)
? TextStyle(
backgroundColor: Theme.of(context).highlightColor,
)
: null,
recognizer: TapGestureRecognizer()..onTap = () => model.onVerseSelected(context, e.key),
),
const WidgetSpan(
child: Padding(
padding: EdgeInsets.only(top: 16, bottom: 16),
),
),
],
)
.expand((element) => element)
.toList(),
),
),
Padding(
padding: EdgeInsets.only(bottom: app.actionsShown ? 120 : 0),
),
],
),
),
),
Expand Down

0 comments on commit e31681b

Please sign in to comment.