skip to Main Content

I have 5 texts in a row, all text is wrapped inside Inkwell, I want the selected text to send to the next page in the flutter, if not selected it should show the select value in a snack bar

Padding(
      padding: const EdgeInsets.only(left: 5, right: 5),
      child: Container(
            decoration: BoxDecoration(
            color: variantList[i] == variantList[i]['varient_color1']
                        ? Colors.grey[100]
                        : Colors.white,
            border: Border.all(
            color: Colors.blueGrey,
               style: BorderStyle.solid,
                   width: 1.0,
             ),
             borderRadius: BorderRadius.circular(3.0),
           ),
           child: InkWell(
             child: Text(" ${variantList[i]['varient_color1']} "),
             onTap: () {},
           )
     ),
),

2

Answers


  1. you can do like this.

    NavigationDemo.dart

    class NavigationDemo extends StatefulWidget {
      const NavigationDemo({Key? key}) : super(key: key);
    
      @override
      _NavigationDemoState createState() => _NavigationDemoState();
    }
    
    class _NavigationDemoState extends State<NavigationDemo> {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: Center(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children:  [
                InkWell(
                    onTap: (){
                      Navigator.push(context, MaterialPageRoute(builder: (context)=>DemoText("Text1")));
    
                    },
                    child: Text('Text1',style: TextStyle(fontSize: 20))),
                SizedBox(width: 10,),
                InkWell(
                    onTap: (){
                      Navigator.push(context, MaterialPageRoute(builder: (context)=> DemoText("Text2")));
    
                    },
                    child: Text('Text2',style: TextStyle(fontSize: 20))),
                SizedBox(width: 10,),
                InkWell(
                    onTap: (){
                      Navigator.push(context, MaterialPageRoute(builder: (context)=>  DemoText("Text3")));
    
                    },
                    child: Text('Text3',style: TextStyle(fontSize: 20))),
                SizedBox(width: 10,),
                InkWell(
                    onTap: (){
                      Navigator.push(context, MaterialPageRoute(builder: (context)=>  DemoText("Text4")));;
                    },
                    child: Text('Text4',style: TextStyle(fontSize: 20))),
                SizedBox(width: 10,),
                InkWell(
                    onTap: (){
                      Navigator.push(context, MaterialPageRoute(builder: (context)=>  DemoText("Text5")));;
                    },
                    child: Text('Text5',style: TextStyle(fontSize: 20))),
              ],
            ),
          ),
        );
      }
    }
    

    DemoText.dart

    class DemoText extends StatefulWidget {
      String text;
       DemoText(this.text);
    
      @override
      _DemoTextState createState() {
        return _DemoTextState();
      }
    }
    
    class _DemoTextState extends State<DemoText> {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: Center(
            child: Text(widget.text,style: TextStyle(fontSize: 20),),
          ),
        );
      }
    }
    

    This is just example you can refer this.

    Login or Signup to reply.
  2. Use Navigator.push to implement this feature, you can pass arguments with your screen name.

      child: InkWell(
           child: Text(" ${variantList[i]['varient_color1']} "),
          onTap: () {
                 Navigator.push(context, MaterialPageRoute(builder: (context)=>  DemoText("${variantList[i]['varient_color1']}")));
          },
       )
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search