Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Slider in Flutter

I want to make the same slider as in the photo. What would be round buttons. I used the flutter_slidable plugin, but it doesn’t work, or I’m doing something wrong. help me please
enter image description here

Below is the code i was trying to do

       Slidable(
                  endActionPane: ActionPane(
                    motion: const DrawerMotion(),
                    children: [
                      SlidableAction(
                        onPressed: (BuildContext context) {},
                        borderRadius:
                            BorderRadius.all(Radius.circular(180)),
                        backgroundColor: const Color(0xFFFE4A49),
                        foregroundColor: Colors.white,
                        icon: Icons.delete,
                      ),
                      SlidableAction(
                        onPressed: (BuildContext context) {},
                        borderRadius: BorderRadius.circular(180),
                        backgroundColor: const Color(0xFFFE4A49),
                        foregroundColor: Colors.white,
                        icon: Icons.delete,
                      ),
                    ],
                  ),
                  child: ListTile(
                      title: Text("Text",
                          style: const TextStyle(fontSize: 18)),
                      subtitle: Text("Text2"),
                      onTap: () {
                      }));

enter image description here

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

Try this code I’ve written it works exactly as you wanted:

Scaffold(

  backgroundColor: Color(0xffF3F3F6),
  body: Center(
    child: Slidable(
      key: const ValueKey(0),
      startActionPane: ActionPane(
        motion: const ScrollMotion(),
        children: [
          Expanded(
              child: Container(
            color: Colors.transparent,
            child: RawMaterialButton(
              onPressed: () {},
              elevation: 2.0,
              fillColor: Colors.red,
              child: Icon(
                Icons.favorite,
              ),
              padding: EdgeInsets.all(12.0),
              shape: CircleBorder(),
            ),
          )),
          Expanded(
              child: Container(
                  color: Colors.transparent,
                  child: RawMaterialButton(
                    onPressed: () {},
                    elevation: 2.0,
                    fillColor: Colors.red,
                    child: Icon(
                      Icons.favorite,
                    ),
                    padding: EdgeInsets.all(12.0),
                    shape: CircleBorder(),
                  ))),
        ],
      ),
      child: const ListTile(
        title: Text('Slide me'),
        tileColor: Colors.white,
      ),
    ),
  ),
);
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading