Get URl from cloud firestore and use Gesture Detector to redirect to the link?-CodePudding

In my project I am making an flutter app which fetch images from cloud firestore. Right now i also want to call URL from cloud firestore so that whenever someone Tap on a particular image they redirect to specific link provided for images.

I have a collection name most and within collection i have 7 documents and within documents i have fields Image and its unique url

And i have this code for fetching images which is working absolutely fine:

FutureBuilder(
    future: getMost(),
    builder:(BuildContext context, AsyncSnapshot snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
        return Lottie.asset('animations/loading.json');
        } else {
            return ListView.builder(
                scrollDirection: Axis.horizontal,
                itemCount: snapshot.data.length,
                itemBuilder: (_, index) {
                    return GestureDetector( onTap: null,
                        child: Padding(
                            padding: const EdgeInsets.all(2.0),
                            child: SizedBox(
                                height: 150.0,
                                width: 130.0,
                                child: Container(
                                    decoration: BoxDecoration(
                                    image: DecorationImage(
                                    image: NetworkImage((snapshot.data[index].data()['image']),),fit: BoxFit.cover),
                                    borderRadius:
                                    BorderRadius.circular(10),
                                    ),
                                )
                            ),
                        ),
                    );
                }
            );
        }
    }
)

CodePudding user response：

Use the flutter package url_launcher if you want to launch any kind of urls.

link : https://pub.dev/packages/url_launcher/

CodePudding user response：

In pubsec.yaml

dependencies:
  url_launcher: ^6.0.18

Actual code:

    openUrl(url) async {
      if (await canLaunch(url)){
        await launch(url);
      }
      else {
        // error
      }
    }  
    
    FutureBuilder(
            future: getMost(),
            builder:(BuildContext context, AsyncSnapshot snapshot) {
                if (snapshot.connectionState == ConnectionState.waiting) {
                return Lottie.asset('animations/loading.json');
                } else {
                    return ListView.builder(
                        scrollDirection: Axis.horizontal,
                        itemCount: snapshot.data.length,
                        itemBuilder: (_, index) {
                            return GestureDetector( onTap: () => openUrl(snapshot.data[index].data()['url']),
                                child: Padding(
                                    padding: const EdgeInsets.all(2.0),
                                    child: SizedBox(
                                        height: 150.0,
                                        width: 130.0,
                                        child: Container(
                                            decoration: BoxDecoration(
                                            image: DecorationImage(
                                            image: NetworkImage((snapshot.data[index].data()['image']),),fit: BoxFit.cover),
                                            borderRadius:
                                            BorderRadius.circular(10),
                                            ),
                                        )
                                    ),
                                ),
                            );
                        }
                    );
                }
            }
        )