diff --git a/lib/components/ayah_box.dart b/lib/components/ayah_box.dart index ba4f14d..22544b5 100644 --- a/lib/components/ayah_box.dart +++ b/lib/components/ayah_box.dart @@ -105,9 +105,11 @@ class _AyahBoxState extends State { ), onPress: () async { final player = AudioPlayer(); - await player.play(UrlSource( - 'https://audio.qurancdn.com/' - '${word['audio_url']}')); + if (word['audio_url'] != null) { + await player.play(UrlSource( + 'https://audio.qurancdn.com/' + '${word['audio_url']}')); + } }, ) ], diff --git a/lib/components/surah_box.dart b/lib/components/surah_box.dart index 08bc885..2c62d82 100644 --- a/lib/components/surah_box.dart +++ b/lib/components/surah_box.dart @@ -11,21 +11,23 @@ class SurahNameBox extends StatelessWidget { @override Widget build(BuildContext context) { return Row( + // mainAxisAlignment: MainAxisAlignment.start, children: [ NumberBox(number: surahNumber), SizedBox(width: 30), - SizedBox( - width: 230, + Center( child: Column( + crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( - surahData[surahNumber]![1], // surah name - style: TextStyle(fontSize: 20), + surahData[surahNumber]?[1], // surah name + style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold), ), Text( - surahData[surahNumber]![ - 2], // surah name translated into English + surahData[surahNumber] + ?[2], // surah name translated into English style: TextStyle(color: Colors.grey[350]), + textAlign: TextAlign.left, ) ], ), diff --git a/lib/main.dart b/lib/main.dart index a7d8031..14abfb0 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -153,8 +153,15 @@ class _HomePageState extends State { SizedBox(height: 50), Expanded( child: SizedBox( - width: 348, - child: ListView.separated( + width: MediaQuery.of(context).size.width - 80, + child: GridView.builder( + gridDelegate: SliverGridDelegateWithFixedCrossAxisCount( + crossAxisCount: + getCrossAxisCount(MediaQuery.sizeOf(context).width), + mainAxisExtent: 87, + mainAxisSpacing: 30, + crossAxisSpacing: 50, + ), itemBuilder: (_, index) => Container( padding: EdgeInsets.all(18), decoration: BoxDecoration( @@ -180,9 +187,6 @@ class _HomePageState extends State { ), ), itemCount: 114, - separatorBuilder: (context, index) => - const SizedBox(height: 20), - addAutomaticKeepAlives: false, ), ), ), diff --git a/lib/utils.dart b/lib/utils.dart index 1ce0b28..175715b 100644 --- a/lib/utils.dart +++ b/lib/utils.dart @@ -30,3 +30,17 @@ String removeSpacesFromString(String string) { return newString; } + +int getCrossAxisCount(double screenWidth) { + switch (screenWidth) { + case < 320: + case >= 320 && <= 767: + return 1; + case >= 768 && <= 991: + return 2; + case >= 992: + return 3; + default: + return 3; + } +}