Problem for alignment

Asked

Viewed 48 times

-1

I have a problem, I can’t put the Radiolisttile next to an image, when I try to put it looks like this:

inserir a descrição da imagem aqui

You can take a look at my code and see what’s wrong:

Scaffold(
    body: Container(
    padding: EdgeInsets.all(32),
decoration: BoxDecoration(
image: DecorationImage
(image: AssetImage("Imagens/Fundo login.jpg"),
fit: BoxFit.fill,
)
 ),
   child: Column(
     mainAxisAlignment: MainAxisAlignment.center,
     crossAxisAlignment: CrossAxisAlignment.center,
     children: <Widget>[

       Padding(
           padding: EdgeInsets.fromLTRB(20, 0, 190, 20),
         child: Image.asset(
           "Imagens/Coreano.jpg",
           width: 500,
           height: 50,
         ),
       ),

      Center(
        child:  Padding(
          padding: EdgeInsets.fromLTRB(90, 0, 0, 0),
          child: RadioListTile(
              title: Text("Coreano"),
              activeColor: Color(0xff5CE6B8),
              value: "coreano",
              groupValue: _escolhaUsuario,
              onChanged: (String escolha){
                setState(() {
                  _escolhaUsuario = escolha;
                });
              }
          ),
        ),
      ),

       Padding(
           padding: EdgeInsets.fromLTRB(20, 0, 190, 0),
         child: Image.asset(
           "Imagens/Espanhol.jpg",
           width: 500,
           height: 53,
         ),
       ),
           Padding(
             padding: EdgeInsets.fromLTRB(90, 0, 0, 0),
             child: RadioListTile(
                 title: Text("Espanhol"),
                 activeColor: Color(0xff5CE6B8),
                 value: "espanhol",
                 groupValue: _escolhaUsuario,
                 onChanged: (String escolha){
                   setState(() {
                     _escolhaUsuario = escolha;
                   });
                 }
             ),
           ),
       Padding(
           padding: EdgeInsets.fromLTRB(20, 0, 190, 0),
         child: Image.asset(
           "Imagens/Ingles.jpg",
           width: 500,
           height: 43,
         ),
       ),
       Padding(
         padding: EdgeInsets.fromLTRB(90, 0, 0, 0),
         child: RadioListTile(
             title: Text("Ingles"),
             activeColor: Color(0xff5CE6B8),
             value: "ingles",
             groupValue: _escolhaUsuario,
             onChanged: (String escolha){
               setState(() {
                 _escolhaUsuario = escolha;
               });
             }
         ),
       ),
       Padding(
         padding: EdgeInsets.only(top: 10),
         child: RaisedButton(
             shape: new RoundedRectangleBorder(borderRadius:
             new BorderRadius.circular(30.0)),
             color: Color(0xff5CE6B8),
             padding: EdgeInsets.all(17),
             child: Text(
               "Finalizar",
               style: TextStyle(
                   fontSize: 16
               ),
             ),
             onPressed: (){
               Navigator.push(
                   context,
                   MaterialPageRoute(
                       builder: (context) => Tela_Principal()
                   )
               );
             }
         ),
       )
     ],
   ),
  )
);
  • Oops, all right? Edit your question and add the code referring to your problem instead of a print... So we can help you in an easier way. If you want you can edit Clicking here

  • See if this helps you: https://answall.com/questions/285620/alignment-radio-com-image

  • A tip to help you understand what’s going on is to wrap your components in a container and put background colors in that container. So you can better visualize the spacing and which part is not in the place you want allowing the adjustment in the right place.

1 answer

0

If your wish is to place beside, I imagine the idea is to have a Line with 2 components. In your code there is only the column by placing one below the other. Make a change and enter the Widget Row with 2 Hildrens, one for the flag and one for the radio.

Example:

Column(
  children: [
    Row(children: [
      //item1, 
      //item2
    ]),
    Row(childrens: [
      //item1, 
      //item2
    ]),
    Row(childrens: [
      //item1, 
      //item2
    ]),
  ]
)

In your code it would be something like this for every iten of your column:

Row(
  children: [
    Image.asset("Imagens/Coreano.jpg", width: 500, height: 50),
    Center(
      child: Padding(
        padding: EdgeInsets.fromLTRB(90, 0, 0, 0),
        child: RadioListTile(
          title: Text("Coreano"),
          activeColor: Color(0xff5CE6B8),
          value: "coreano",
          groupValue: _escolhaUsuario,
          onChanged: (String escolha) {
            setState(() {
              _escolhaUsuario = escolha;
            });
          },
        ),
      ),
    ),
  ],
)
  • When I do that my screen turns all white

Browser other questions tagged

You are not signed in. Login or sign up in order to post.