Local json ile Search

mirzaAli

Local json ile search yapmaya calisiyorum. malesef yapamadim.
buradaki ornek gibi yapmaya calistim fakat burada Api ile yapilmis ve tek sayfada.
ben servisi yani jasonu decode etdigim kodu ve modeli ayri sayfada tutuyorum.

buradaki ornek : https://www.youtube.com/watch?v=mYiyICUrtw8&t=340s
**buradaki ornek github ** : https://github.com/edicybereye/flutter_search_logic

benim yapmak istedigim burada tab1(Text1)de sureleri search yapmak tab2(Text2) de ayetleri search yapmak
yardimci olursaniz sevinirim. Tesekkurler 🙂

burada : ->> resim1: https://imgyukle.com/i/ugq6Nb , resim 2 : https://imgyukle.com/i/ugq4RS

projemin github sayfasi : https://github.com/sahmirzeli1806/quran_app

yasintuncel

sureler icin

Future<List<SurahInfo>> loadInfo() async {
    var response = await rootBundle.loadString(infosurah);
    Iterable data = json.decode(response);
    return data.map((model) => SurahInfo.fromJson(model)).toList();
  }

buradan donen listeyi istediğiniz değişkenine gore taratin. mesela ‘name’.
search icin kullanacaginiz textfield in onChange özelliğinde, textfield e yazılan text i yukarıdaki fonksiyon ile donen listede her bir ‘surah_info’ modelinin in name degistenini içeriyor mu diye kontrol edip, ui icin kullandiginiz listeyi setstate etmeniz lazım.

bu arada kullandiginiz json verileri güzelmiş. Turkce icin benzer yapıda api var mi acaba 🙂

Asagi yukarı asagidakine benzer bir yapı olacak. bunun benzerini de ayet icin yapicaksiniz.

List<SurahInfo> serachResultList = new List();
...
List<SurahInfo> allSurahInfos = await loadInfo(); // herhangi bir yerde bu değişkeni doldur future builder veya init state
...
TextField(
   onChanged: (text) {
      allSurahInfos.foreach((e){
         if(e.name. contains(text))
            serachResultList.add(e);
      });
      setState();
   },
)

NOT: syntax hatasi olabilir manuel yazdım.

mirzaAli

yasintuncel Tesekkurler Hocam, ama malesef yapamadim :/

mirzaAli

yasintuncel mesela bu kisim hata veriyor.

List<SurahInfo> allSurahInfos = await loadInfo(); // herhangi bir yerde bu değişkeni doldur future builder veya init state

benim loadinfe ( decode kodlari ) diger sayfada oldugu icin sanirsam. oradaki degiskenleri nasil bu sayfada kullana bilirim ?
vaktiniz olursa rica etsem Anydesk ile bakabilirmisiniz?

yasintuncel

mirzaAli onu direk öyle degil de fonksiyonda kullanin. bu fonksiyonu da init state de cagirin.

baska bir dosyadaki değişkenleri import ederek kullanabilirsiniz. şöyle dusunun eğer bir dosyayı import ederseniz kodları ayni dosyada alt alta yazmış gibi olursunuz.

....

import 'package:proje_adi/dosya_yolu.dart'; // diger dosyanızı import edin
...
List<SurahInfo> allSurahInfos;

getSurahInfos() async {
   allSurahInfos = await loadInfo();
}
...
@override
  void initState() {
    super.initState();
    getSurahInfos();
}

yasintuncel

mirzaAli

oradaki degiskenleri nasil bu sayfada kullana bilirim ? tam anlamadım hocam. hangi dosyadaki hangi değişkeni nerede kullanmak istiyorsunuz. dosyaların isimlerini yazın git ten inceleyeyim.

mirzaAli

yasintuncel Hocam tabii ki import etmistim. loadInfo() kismi yine hata veriyor. :/

mirzaAli

yasintuncel loadInfo hata veriyor . yani service.dart daki loadInfo .

mirzaAli

yasintuncel vaktiniz olursa rica etsem Anydesk ile bakabilirmisiniz?

yasintuncel

mirzaAli bakalim hocam
isterseniz discord tan yazin

mirzaAli

yasintuncel yazdim Hocam

yasintuncel

Problemi cozduk. kodlar arkadaşın GitHub proje linkinde.
https://github.com/mirzaAli20/quran_app/blob/master/lib/ui/listpage/list_all_quran.dart

...
List<SurahInfo> allSurahInfos = new List();
List<SurahInfo> serachResultList = new List();
List<SurahInfo> viewSurahList = new List();
...

getSurahInfos() async {
    allSurahInfos = await serviceData.loadInfo();
    viewSurahList = allSurahInfos;
    setState(() {});
  }

  @override
  void initState() {
    super.initState();
    serviceData = ServiceData();
    getSurahInfos(); // burada json i bir kez cektik
  }
 @override
  Widget build(BuildContext context) {
    return allSurahInfos.isNotEmpty
        ? SingleChildScrollView(
            child: Column(
              children: [
                Container(
                  margin:
                      EdgeInsets.only(top: 15, left: 22, right: 22, bottom: 5),
                  child: TextField(
                    decoration: InputDecoration(
                      suffixIcon: Icon(Icons.search),

                      border: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(50),
                      ),
                      hintText: 'Search ',
                      alignLabelWithHint: false,

                      // filled: true
                    ),
                    onChanged: (text) {
                      if (text == '') {
                        viewSurahList =
                            allSurahInfos; // buger arama bos ise tum listeyi alicak
                      } else {
                        serachResultList.clear();
                        allSurahInfos.forEach((e) {
                          if (e.latin.toLowerCase().contains(text.toLowerCase())) serachResultList.add(e);
                        });
                        viewSurahList =
                            serachResultList; // arama bos degilse kelimeye alacak

                      }
                      setState(() {});
                    },
                    textInputAction: TextInputAction.done,
                    keyboardType: TextInputType.text,
                  ),
                ),
                ListView(
                    physics: ScrollPhysics(),
                    shrinkWrap: true,
                    children: viewSurahList
                        .map((data) => CardSurah(
                              title: data.latin,
                              subtitle: data.translation,
                              surah: data.index.toString(),
                              ayah: data.ayahCount.toString(),
                              arabic: data.arabic.toString(),
                              onTap: () {
                                Navigator.push(
                                    context,
                                    MaterialPageRoute(
                                        builder: (context) => DetailSurah(
                                            detail: data.latin,
                                            index: data.index)));
                              },
                            ))
                        .toList()),
              ],
            ),
          )
        : PKCardListSkeleton(
            isCircularImage: true,
            isBottomLinesActive: true,
            length: 10,
          );
  }

Flutter

yasintuncel Elinize sağlık
Kodları paylaştığınız için teşekkürler