DraggableScrollableSheet flutter

 


import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:voicefeed/utils/colors.dart';
import 'package:voicefeed/widgets/custom_text.dart';

class FlashScreen extends StatefulWidget {
  @override
  _FlashScreenState createState() => _FlashScreenState();
}

class _FlashScreenState extends State<FlashScreen> {
  int _currentIndex = 0;

  List<String> imageUrls = [
    'https://island.lk/wp-content/uploads/2022/11/sunset.jpg',
    'https://i.natgeofe.com/k/f0038f41-8065-4a7d-871f-79bdb83aa9e8/greenland-nuuk.jpg',
    // Add more image URLs here
  ];

  List<String> hashtags = [
    "#Morning",
    "#Evening",
    // Add more hashtags here
  ];

  List<String> timestamps = [
    "2 hours ago",
    "3 hours ago",
    // Add more timestamps here
  ];

  void _nextPage() {
    if (_currentIndex < imageUrls.length - 1) {
      setState(() {
        _currentIndex++;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: <Widget>[
          Positioned.fill(
            child: Image.network(
              imageUrls[_currentIndex],
              fit: BoxFit.cover,
            ),
          ),
          DraggableScrollableSheet(
            initialChildSize: 0.4,
            minChildSize: 0.4,
            maxChildSize: 1.0,
            builder: (BuildContext context, ScrollController scrollController) {
              return Container(
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(16),
                    topRight: Radius.circular(16),
                  ),
                ),
                child: ListView(
                  controller: scrollController,
                  padding: EdgeInsets.all(16),
                  children: [
                    Row(
                      children: [
                        IconButton(
                          icon: Icon(Icons.arrow_back),
                          onPressed: () {
                            Navigator.pop(context);
                          },
                        ),
                        Stack(
                          children: [
                            CircleAvatar(
                              radius: 32,
                              backgroundColor: whiteColor,
                              child: CircleAvatar(
                                radius: 28,
                                backgroundColor: whiteColor,
                                backgroundImage: NetworkImage(
                                    'https://fiverr-res.cloudinary.com/t_profile_original,q_auto,f_auto/attachments/profile/photo/ee553427796240c6821a5510b66aec34-1683088038643/ed6ed48f-c48a-46b9-9ab6-da746551f522.jpg'),
                              ),
                            ),
                            Positioned(
                              bottom: 0,
                              right: -2,
                              child: SvgPicture.asset(
                                "assets/flash.svg",
                                semanticsLabel: 'Acme Logo',
                                height: 30,
                                width: 30,
                              ),
                            ),
                          ],
                        ),
                        const SizedBox(
                          width: 15,
                        ),
                        Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            CustomText(
                              size: 22,
                              text: hashtags[_currentIndex],
                              textColor: blackColor,
                              fontWeight: FontWeight.w700,
                            ),
                            CustomText(
                              size: 14,
                              text: timestamps[_currentIndex],
                              textColor: blackColor,
                              fontWeight: FontWeight.w400,
                            ),
                          ],
                        )
                      ],
                    ),
                    // Add more content here if needed
                  ],
                ),
              );
            },
          ),
        ],
      ),
    );
  }
}

Comments