tangheem/lib/ui/screens/bookmark_screen.dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_slidable/flutter_slidable.dart';
import 'package:tangheem/classes/colors.dart';
import 'package:tangheem/classes/utils.dart';
import 'package:tangheem/extensions/int_extensions.dart';
import 'package:tangheem/extensions/string_extensions.dart';
import 'package:tangheem/extensions/widget_extensions.dart';
import 'package:tangheem/models/bookmark_model.dart';
import 'package:tangheem/models/surah_model.dart';
import 'package:tangheem/ui/misc/no_data_ui.dart';
import 'package:tangheem/ui/screens/quran_screen.dart';

class BookmarkScreen extends StatefulWidget {
  static const String routeName = "/bookmark";
  final String tangheemQuery;
  final String tangheemTypeName;
  final SurahModelData surah;

  BookmarkScreen({Key key, this.surah, this.tangheemQuery, this.tangheemTypeName}) : super(key: key);

  @override
  _BookmarkScreenState createState() {
    return _BookmarkScreenState();
  }
}

class _BookmarkScreenState extends State<BookmarkScreen> {
  List<BookMarkModel> _bookMarkList = [];
  SlidableController _slidableController;

  @override
  void initState() {
    _slidableController = SlidableController(
      onSlideAnimationChanged: handleSlideAnimationChanged,
      onSlideIsOpenChanged: handleSlideIsOpenChanged,
    );
    super.initState();
    getBookMark();
  }

  void handleSlideAnimationChanged(Animation<double> slideAnimation) {}

  void handleSlideIsOpenChanged(bool isOpen) {}

  void getBookMark() async {
    Utils.showLoading(context);
    _bookMarkList = await BookMarkModel.getFromPrefs();
    _bookMarkList = _bookMarkList.reversed.toList();
    Utils.hideLoading(context);
    setState(() {});
  }

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
    Widget _header = Stack(
      alignment: Alignment.center,
      children: [
        SizedBox(
          height: isPortrait ? null : double.infinity,
          width: double.infinity,
          child: AspectRatio(
            aspectRatio: 375 / 215,
            child: Image.asset("assets/icons/new/quran_bg.jpg", fit: BoxFit.cover, alignment: Alignment(isPortrait ? -0.3 : -0.45, 0.5)),
          ),
        ),
        Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Image.asset('assets/icons/new/Tangeem-logo-W.png', width: 50),
            26.height,
            "المرجعية".toText(30),
          ],
        ).paddingOnly(top: 16),
      ],
    );

    Widget _dataListView = (_bookMarkList?.isEmpty ?? true)
        ? NoDataUI().paddingOnly(top: isPortrait ? 215 : 0)
        : ListView.separated(
            physics: isPortrait ? NeverScrollableScrollPhysics() : null,
            shrinkWrap: isPortrait,
            padding: EdgeInsets.all(24),
            itemCount: _bookMarkList.length,
            separatorBuilder: (context, index) => 12.height,
            itemBuilder: (context, index) {
              return Row(children: [
                Container(
                  width: double.infinity,
                  padding: EdgeInsets.symmetric(vertical: 6, horizontal: 12),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(20),
                    border: Border.all(color: ColorConsts.greyLightColor, width: 1),
                  ),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Row(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          Icon(Icons.bookmark, color: ColorConsts.dark2Text, size: 18),
                          8.width,
                          (_bookMarkList[index].surahNameAR).toText(16, color: ColorConsts.darkText),
                          12.width,
                          Text(
                            "الآية رقم ${_bookMarkList[index].numberInSurah}",
                            style: TextStyle(fontSize: 14, color: ColorConsts.brownB7Color),
                          ),
                        ],
                      ),
                      // Text(
                      //   _bookMarkList[index].reverseAyatNumber(),
                      //   textAlign: TextAlign.start,
                      //   style: TextStyle(
                      //     fontFamily: "UthmanicHafs",
                      //     fontSize: 16,
                      //     color: ColorConsts.primaryBlue,
                      //     fontWeight: FontWeight.bold,
                      //   ),
                      // ),
                    ],
                  ),
                ).onPress(() {
                  Navigator.pushNamed(context, QuranScreen.routeName, arguments: _bookMarkList[index]);
                }).expanded,
                12.width,
                Icon(Icons.cancel_outlined, color: ColorConsts.greyLightColor).onPress(() {
                  _bookMarkList.removeAt(index);
                  BookMarkModel.saveToPrefs(_bookMarkList);
                  Utils.showToast("تم حذف المرجع");
                  setState(() {});
                }),
                8.width,
                Icon(Icons.arrow_forward_ios_rounded, color: ColorConsts.brownB7Color).onPress(() {
                  Navigator.pushNamed(context, QuranScreen.routeName, arguments: _bookMarkList[index]);
                }),
              ]);
              return Slidable(
                controller: _slidableController,
                actionPane: SlidableBehindActionPane(),
                secondaryActions: <Widget>[
                  ClipRRect(
                    borderRadius: BorderRadius.circular(20),
                    child: IconSlideAction(
                      color: Colors.redAccent,
                      icon: Icons.delete,
                      closeOnTap: true,
                      onTap: () {
                        _bookMarkList.removeAt(index);
                        BookMarkModel.saveToPrefs(_bookMarkList);
                        Utils.showToast("تم حذف المرجع");
                        setState(() {});
                      },
                    ),
                  ),
                ],
                child: Container(
                  width: double.infinity,
                  padding: EdgeInsets.fromLTRB(12, 12, 12, 12),
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(20),
                    border: Border.all(color: ColorConsts.greyE0Color, width: 1),
                  ),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Row(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          (_bookMarkList[index].surahNameAR + ":").toText(12, color: ColorConsts.primaryBlue),
                          Text(
                            " ${_bookMarkList[index].numberInSurah}",
                            style: TextStyle(fontSize: 14, fontFamily: "BArabics", color: ColorConsts.secondaryOrange),
                          ),
                        ],
                      ),
                      Text(
                        _bookMarkList[index].reverseAyatNumber(),
                        textAlign: TextAlign.start,
                        style: TextStyle(
                          fontFamily: "UthmanicHafs",
                          fontSize: 16,
                          color: ColorConsts.primaryBlue,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ],
                  ),
                ).onPress(() {
                  Navigator.pushNamed(context, QuranScreen.routeName, arguments: _bookMarkList[index]);
                }),
              );
            },
          );

    return SizedBox(
      height: double.infinity,
      child: isPortrait
          ? SingleChildScrollView(
              child: Column(
                children: [_header, _dataListView],
              ),
            )
          : Row(
              children: [
                Expanded(child: _header, flex: 4),
                Expanded(child: _dataListView, flex: 6),
              ],
            ),
    );
  }
}