From 709b43d95dc4e28dd7028d1f2ae9aacd60059591 Mon Sep 17 00:00:00 2001 From: h7x4abk3g Date: Fri, 10 Jul 2020 13:28:31 +0200 Subject: [PATCH] Update Kanji Layout --- lib/components/kanji/kanji_search_page.dart | 124 +++++++++++++++++--- lib/screens/kanji_search.dart | 2 +- lib/services/kanji_search.dart | 0 3 files changed, 111 insertions(+), 15 deletions(-) create mode 100644 lib/services/kanji_search.dart diff --git a/lib/components/kanji/kanji_search_page.dart b/lib/components/kanji/kanji_search_page.dart index 7348db4..638a4d0 100644 --- a/lib/components/kanji/kanji_search_page.dart +++ b/lib/components/kanji/kanji_search_page.dart @@ -8,14 +8,13 @@ class _Header extends StatelessWidget { @override Widget build(BuildContext context) { return Container( - margin: EdgeInsets.symmetric(vertical: 20.0), decoration: BoxDecoration( borderRadius: BorderRadius.circular(10.0), color: Colors.blue), child: Padding( padding: const EdgeInsets.all(10.0), child: Text( _kanji, - style: TextStyle(fontSize: 70.0, color: Colors.white), + style: TextStyle(fontSize: 80.0, color: Colors.white), ), ), ); @@ -48,6 +47,30 @@ class _JlptLevel extends StatelessWidget { _JlptLevel(this._jlptLevel); } +class _Rank extends StatelessWidget { + final int _rank; + + @override + Widget build(BuildContext context) { + return Container( + padding: EdgeInsets.all(10.0), + child: Text( + '${_rank.toString()} / 2500', + style: TextStyle( + color: Colors.white, + fontSize: 20.0, + ), + ), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(10.0), + color: Colors.blue, + ), + ); + } + + _Rank(this._rank); +} + class _Grade extends StatelessWidget { final String _grade; @@ -72,6 +95,30 @@ class _Grade extends StatelessWidget { _Grade(this._grade); } +class _Radical extends StatelessWidget { + final Radical _radical; + + @override + Widget build(BuildContext context) { + return Container( + padding: EdgeInsets.all(10.0), + child: Text( + _radical.symbol, + style: TextStyle( + color: Colors.white, + fontSize: 20.0, + ), + ), + decoration: BoxDecoration( + shape: BoxShape.circle, + color: Colors.blue, + ), + ); + } + + _Radical(this._radical); +} + class _StrokeOrderGif extends StatelessWidget { final String _uri; @@ -80,8 +127,10 @@ class _StrokeOrderGif extends StatelessWidget { return Container( margin: EdgeInsets.symmetric(vertical: 20.0), padding: EdgeInsets.all(5.0), - child: ClipRRect(child: Image.network(_uri), - borderRadius: BorderRadius.circular(10.0),), + child: ClipRRect( + child: Image.network(_uri), + borderRadius: BorderRadius.circular(10.0), + ), decoration: BoxDecoration( color: Colors.blue, borderRadius: BorderRadius.circular(15.0), @@ -99,18 +148,65 @@ class KanjiResultCard extends StatelessWidget { Widget build(BuildContext context) { return Column( children: [ - Row( - mainAxisAlignment: MainAxisAlignment.center, - children: [_Header(_result.query)], + Container( + margin: EdgeInsets.fromLTRB(20.0, 20.0, 20.0, 30.0), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceEvenly, + children: [ + Flexible( + flex: 1, + fit: FlexFit.tight, + child: Center(child: SizedBox()), + ), + Flexible( + flex: 1, + fit: FlexFit.tight, + child: Center(child: _Header(_result.query)), + ), + Flexible( + flex: 1, + fit: FlexFit.tight, + child: Center( + child: _Radical(_result.radical), + ), + ), + ], + ), ), - Row( - mainAxisAlignment: MainAxisAlignment.spaceEvenly, - children: [_JlptLevel(_result.jlptLevel), _Grade(_result.taughtIn)], + IntrinsicHeight( + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceEvenly, + children: [ + _StrokeOrderGif(_result.strokeOrderGifUri), + Container( + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceEvenly, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + children: [ + Text("JLPT: ", style: TextStyle(fontSize: 20.0)), + _JlptLevel(_result.jlptLevel), + ], + ), + Row( + children: [ + Text("Grade: ", style: TextStyle(fontSize: 20.0)), + _Grade(_result.taughtIn), + ], + ), + Row( + children: [ + Text("Rank: ", style: TextStyle(fontSize: 20.0)), + _Rank(_result.newspaperFrequencyRank), + ], + ), + ], + ), + ), + ], + ), ), - Row( - mainAxisAlignment: MainAxisAlignment.center, - children: [_StrokeOrderGif(_result.strokeOrderGifUri)], - ) ], ); } diff --git a/lib/screens/kanji_search.dart b/lib/screens/kanji_search.dart index 5963b7f..eaeb72a 100644 --- a/lib/screens/kanji_search.dart +++ b/lib/screens/kanji_search.dart @@ -4,6 +4,6 @@ import 'package:jisho_study_tool/services/jisho_search.dart'; class KanjiView extends StatelessWidget { @override Widget build(BuildContext context) { - return searchForKanji('谷'); + return searchForKanji('拒'); } } diff --git a/lib/services/kanji_search.dart b/lib/services/kanji_search.dart new file mode 100644 index 0000000..e69de29