diff --git a/lib/components/list.dart b/lib/components/layout.dart similarity index 74% rename from lib/components/list.dart rename to lib/components/layout.dart index 5aa4528..3fd26bb 100644 --- a/lib/components/list.dart +++ b/lib/components/layout.dart @@ -3,13 +3,15 @@ import 'package:flutter_redux/flutter_redux.dart'; import 'package:holybible/actions/actions.dart'; import 'package:holybible/models/version.dart'; import 'package:holybible/reducers/app_state.dart'; +import 'package:holybible/screens/bible/biblelist_screen.dart'; import 'package:holybible/screens/bible/searchlist_screen.dart'; +import 'package:holybible/screens/hymn/hymnlist_screen.dart'; import 'package:redux/redux.dart'; -class ExpandedAppBar extends StatelessWidget { +class BibleExpandedAppBar extends StatelessWidget { final String _title; - ExpandedAppBar(this._title); + BibleExpandedAppBar(this._title); @override Widget build(BuildContext context) { @@ -22,15 +24,36 @@ class ExpandedAppBar extends StatelessWidget { title: Text(_title), centerTitle: true ), - actions: createAppBarActions(context), + actions: [ + SearchButton(), + SettingButton() + ], ); } } -List createAppBarActions(context) => [ - SearchButton(), - SettingButton() -]; +class ExpandedAppBar extends StatelessWidget { + final String _title; + + ExpandedAppBar(this._title); + + @override + Widget build(BuildContext context) { + return SliverAppBar( + floating: false, + pinned: true, + snap: false, + expandedHeight: 100.0, + flexibleSpace: FlexibleSpaceBar( + title: Text(_title), + centerTitle: true + ), + actions: [ + SettingButton() + ], + ); + } +} class SearchButton extends StatelessWidget { @override @@ -45,7 +68,6 @@ class SearchButton extends StatelessWidget { }, ); } - } class SettingButton extends StatelessWidget { @@ -181,5 +203,49 @@ class _ThemeSetting extends StatelessWidget { ], ); } +} + + +class _AppNavigationItem { + IconData icon; + String title; + String routeName; + + _AppNavigationItem({this.icon, this.title, this.routeName}); +} + +var _appNavigationItems = <_AppNavigationItem>[ + _AppNavigationItem( + icon: Icons.book, + title: '성경', + routeName: BibleListScreen.routeName + ), + _AppNavigationItem( + icon: Icons.music_note, + title: '찬송가', + routeName: HymnListScreen.routeName + ) +]; -} \ No newline at end of file +class AppNavigationBar extends StatelessWidget { + final int _currentIndex; + AppNavigationBar(this._currentIndex); + + @override + Widget build(BuildContext context) { + return BottomNavigationBar( + currentIndex: _currentIndex, + items: _appNavigationItems.map((item) => BottomNavigationBarItem( + icon: Icon(item.icon), + title: Text(item.title) + )).toList(), + onTap: (index) { + Navigator.pushReplacementNamed( + context, + _appNavigationItems[index].routeName + ); + }, + ); + } + +} diff --git a/lib/main.dart b/lib/main.dart index 6e06a4d..8dc5006 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -8,6 +8,7 @@ import 'package:holybible/screens/bible/chapterlist_screen.dart'; import 'package:holybible/screens/hymn/hymnlist_screen.dart'; import 'package:holybible/screens/bible/searchlist_screen.dart'; import 'package:holybible/screens/bible/verselist_screen.dart'; +import 'package:holybible/screens/hymn/hymnscore_screen.dart'; import 'package:holybible/screens/main_screen.dart'; import 'package:redux/redux.dart'; @@ -46,14 +47,15 @@ class _ThemeApp extends StatelessWidget { color: Color.fromRGBO(64, 64, 64, 0.9), ), ), - initialRoute: '/', + initialRoute: MainScreen.routeName, routes: { MainScreen.routeName: (context) => MainScreen(), BibleListScreen.routeName: (context) => BibleListScreen(), ChapterListScreen.routeName: (context) => ChapterListScreen(), VerseListScreen.routeName: (context) => VerseListScreen(), SearchListScreen.routeName: (context) => SearchListScreen(), - HymnListScreen.routeName: (context) => HymnListScreen() + HymnListScreen.routeName: (context) => HymnListScreen(), + HymnScoreScreen.routeName: (context) => HymnScoreScreen(), } ); }, diff --git a/lib/screens/bible/biblelist_screen.dart b/lib/screens/bible/biblelist_screen.dart index 99a3c3e..a850ab9 100644 --- a/lib/screens/bible/biblelist_screen.dart +++ b/lib/screens/bible/biblelist_screen.dart @@ -1,6 +1,6 @@ import 'package:flutter/material.dart'; import 'package:flutter_redux/flutter_redux.dart'; -import 'package:holybible/components/list.dart'; +import 'package:holybible/components/layout.dart'; import 'package:holybible/models/bible.dart'; import 'package:holybible/models/version.dart'; import 'package:holybible/reducers/app_state.dart'; @@ -81,7 +81,7 @@ class _BibleListWidgetState extends State<_BibleListWidget> { return Scaffold( body: CustomScrollView( slivers: [ - ExpandedAppBar(widget.version.name), + BibleExpandedAppBar(widget.version.name), SliverFixedExtentList( itemExtent: 50.0, delegate: SliverChildBuilderDelegate( @@ -107,7 +107,8 @@ class _BibleListWidgetState extends State<_BibleListWidget> { ) ) ], - ) + ), + bottomNavigationBar: AppNavigationBar(0), ); } diff --git a/lib/screens/bible/chapterlist_screen.dart b/lib/screens/bible/chapterlist_screen.dart index 11b4aaf..78bbd9b 100644 --- a/lib/screens/bible/chapterlist_screen.dart +++ b/lib/screens/bible/chapterlist_screen.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_redux/flutter_redux.dart'; -import 'package:holybible/components/list.dart'; +import 'package:holybible/components/layout.dart'; import 'package:holybible/models/bible.dart'; import 'package:holybible/reducers/app_state.dart'; import 'package:holybible/repository/bible_repository.dart'; @@ -104,7 +104,7 @@ class _ChapterListState extends State<_ChapterList> { return Scaffold( body: CustomScrollView( slivers: [ - ExpandedAppBar(bible.name), + BibleExpandedAppBar(bible.name), SliverFixedExtentList( itemExtent: 50.0, delegate: SliverChildBuilderDelegate( diff --git a/lib/screens/bible/searchlist_screen.dart b/lib/screens/bible/searchlist_screen.dart index 2514227..cfb8aa8 100644 --- a/lib/screens/bible/searchlist_screen.dart +++ b/lib/screens/bible/searchlist_screen.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_redux/flutter_redux.dart'; -import 'package:holybible/components/list.dart'; +import 'package:holybible/components/layout.dart'; import 'package:holybible/models/verse.dart'; import 'package:holybible/reducers/app_state.dart'; import 'package:holybible/repository/bible_repository.dart'; diff --git a/lib/screens/bible/verselist_screen.dart b/lib/screens/bible/verselist_screen.dart index 7e4f8f2..5c8c265 100644 --- a/lib/screens/bible/verselist_screen.dart +++ b/lib/screens/bible/verselist_screen.dart @@ -1,7 +1,7 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:flutter_redux/flutter_redux.dart'; -import 'package:holybible/components/list.dart'; +import 'package:holybible/components/layout.dart'; import 'package:holybible/models/bible.dart'; import 'package:holybible/models/verse.dart'; import 'package:holybible/reducers/app_state.dart'; @@ -106,7 +106,10 @@ class _VerseListWidgetState extends State<_VerseListWidget> { return Scaffold( appBar: AppBar( title: Text('${bible.name} $selectedChapter'), - actions: createAppBarActions(context), + actions: [ + SearchButton(), + SettingButton() + ], ), body: PageView.builder( controller: PageController( diff --git a/lib/screens/hymn/hymnlist_screen.dart b/lib/screens/hymn/hymnlist_screen.dart index 4e35dc3..4b7813e 100644 --- a/lib/screens/hymn/hymnlist_screen.dart +++ b/lib/screens/hymn/hymnlist_screen.dart @@ -1,8 +1,9 @@ import 'package:flutter/material.dart'; -import 'package:holybible/components/list.dart'; +import 'package:holybible/components/layout.dart'; import 'package:holybible/models/hymn.dart'; import 'package:holybible/repository/hymn_repository.dart'; +import 'package:holybible/screens/hymn/hymnscore_screen.dart'; class HymnListScreen extends StatelessWidget { static String routeName = '/hymn'; @@ -41,17 +42,25 @@ class _HymnListState extends State<_HymnListWidget> { SliverFixedExtentList( itemExtent: 50.0, delegate: SliverChildBuilderDelegate( - (context, index) => ListTile( - title: Text(hymns[index].title), + (context, index) { + var hymn = hymns[index]; + return ListTile( + title: Text('${hymn.number}장 ${hymn.title}'), onTap: () { - // + Navigator.pushNamed( + context, + HymnScoreScreen.routeName, + arguments: HymnSoreScreenArguments(hymn) + ); }, - ), - childCount: hymns.length + ); + }, + childCount: hymns.length ) ) ], - ) + ), + bottomNavigationBar: AppNavigationBar(1), ); } } diff --git a/lib/screens/hymn/hymnscore_screen.dart b/lib/screens/hymn/hymnscore_screen.dart new file mode 100644 index 0000000..ffa6539 --- /dev/null +++ b/lib/screens/hymn/hymnscore_screen.dart @@ -0,0 +1,42 @@ + +import 'package:flutter/cupertino.dart'; +import 'package:flutter/material.dart'; +import 'package:holybible/models/hymn.dart'; +import 'package:photo_view/photo_view.dart'; + +class HymnScoreScreen extends StatelessWidget { + static String routeName = '/hymn/score'; + + @override + Widget build(BuildContext context) { + HymnSoreScreenArguments args = ModalRoute.of(context).settings.arguments; + return _HymnScoreWidget(args.hymn); + } +} + +class HymnSoreScreenArguments { + final Hymn hymn; + HymnSoreScreenArguments(this.hymn); +} + +class _HymnScoreWidget extends StatelessWidget { + final Hymn hymn; + _HymnScoreWidget(this.hymn); + + @override + Widget build(BuildContext context) { + var imagePath = 'assets/hymns/newhymn-${hymn.number.toString().padLeft(3, '0')}.jpg'; + print(imagePath); + return Scaffold( + appBar: AppBar(), + body: Container( + child: PhotoView( + imageProvider: AssetImage(imagePath), + backgroundDecoration: BoxDecoration( + color: Colors.white + ), + ), + ) + ); + } +} diff --git a/pubspec.lock b/pubspec.lock index db8e03e..383fb85 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -82,7 +82,7 @@ packages: name: meta url: "https://pub.dartlang.org" source: hosted - version: "1.1.7" + version: "1.1.6" path: dependency: "direct main" description: @@ -97,6 +97,13 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "2.4.0" + photo_view: + dependency: "direct main" + description: + name: photo_view + url: "https://pub.dartlang.org" + source: hosted + version: "0.5.0" redux: dependency: "direct main" description: @@ -181,4 +188,4 @@ packages: version: "2.1.16" sdks: dart: ">=2.4.0 <3.0.0" - flutter: ">=1.5.0 <2.0.0" + flutter: ">=1.5.9-pre.94 <2.0.0" diff --git a/pubspec.yaml b/pubspec.yaml index 12b200c..9228af3 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -28,6 +28,7 @@ dependencies: flutter_redux: ^0.5.3 path: ^1.6.4 shared_preferences: ^0.5.3+4 + photo_view: ^0.5.0 dev_dependencies: flutter_launcher_icons: "^0.7.3" @@ -50,6 +51,7 @@ flutter: assets: - assets/holybible.db - assets/icon/ico_holybible.png + - assets/hymns/ # An image asset can refer to one or more resolution-specific "variants", see # https://flutter.dev/assets-and-images/#resolution-aware.