Flattern - Radio-Animation wird nicht auf ShowDialog angezeigt

Question

Ich versuche, eine Radio in einem showDialog zu erstellen, aber die Animation, die auf Radio auftritt, erscheint nicht in showDialog.

Zum Beispiel: Wenn in foo2 nichts geklopft geschieht, und wenn man Ausfahrt in showDialog und geht auf mich zurück, wird foo2 ausgewählt.

Unten ist der Code und ein gif zeigt, was geschieht:

import "package:flutter/material.dart"; 

void main() { 
    runApp(new ControlleApp()); 
} 

class ControlleApp extends StatelessWidget { 
    @override 
    Widget build(BuildContext context) { 
    return new MaterialApp(
     title: "My App", 
     home: new HomePage(), 
    ); 
    } 
} 

class HomePage extends StatefulWidget { 
    @override 
    HomePageState createState() => new HomePageState(); 
} 

enum _RadioGroup { 
    foo1, 
    foo2 
} 

class HomePageState extends State<HomePage> { 
    _RadioGroup _itemType = _RadioGroup.foo1; 

    void changeItemType(_RadioGroup type) { 
    setState(() { 
     _itemType = type; 
    }); 
    } 

    void showDemoDialog<T>({ BuildContext context, Widget child }) { 
    showDialog<T>(
     context: context, 
     child: child, 
    ); 
    } 

    @override 
    Widget build(BuildContext context){ 
    return new Scaffold( 
     appBar: new AppBar(backgroundColor: new Color(0xFF26C6DA)), 
     body: new Container(
     child: new Row(
      mainAxisAlignment: MainAxisAlignment.center, 
      children: <Widget>[ 
      new InkWell(
       onTap:(){ 
       showDemoDialog<String>(
        context: context, 
        child: new SimpleDialog(
        title: const Text("show"), 
        children: <Widget>[ 
         new Row(
         mainAxisAlignment: MainAxisAlignment.center, 
         children: <Widget>[ 
          new Radio<_RadioGroup>(
          groupValue: _itemType, 
          value: _RadioGroup.foo1, 
          onChanged: changeItemType 
         ), 
          const Text("foo1"), 

          new Radio<_RadioGroup>(
          groupValue: _itemType, 
          value: _RadioGroup.foo2, 
          onChanged: changeItemType 
         ), 
          const Text("foo2"), 
         ], 
        ) 
        ], 
       ) 
       ); 
       }, 
       child: new Container(
       margin: new EdgeInsets.only(top: 16.0, bottom: 8.0), 
       child: new Text("Show"), 
      ), 
      ) 
      ], 
     ), 
    ) 
    ); 
    } 
} 

Answer 1

Denken Sie daran, dass die Komponenten unveränderlich sind. Wenn Sie showDialog aufrufen, wird der Inhalt dieses Dialogfelds nicht ändern, auch wenn HomePage tun.

Die Lösung ist einfach. Sie müssen nur ein bisschen Ihren Code so etwas wie Refactoring:

showDialog(
     context: context, 
     child: new MyForm() 
    ) 

und stattdessen den Zustand der HomePage ändern, Sie stattdessen den Zustand MyForm ändern.

Beispiel:

class Test extends StatelessWidget { 
    void onSubmit(String result) { 
    print(result); 
    } 

    @override 
    Widget build(BuildContext context) { 
    return new Scaffold(
     body: new Center(
     child: new RaisedButton(
      onPressed:() => showDialog(context: context, child: new MyForm(onSubmit: onSubmit)), 
      child: new Text("dialog"), 
     ), 
    ), 
    ); 
    } 
} 

typedef void MyFormCallback(String result); 

class MyForm extends StatefulWidget { 
    final MyFormCallback onSubmit; 

    MyForm({this.onSubmit}); 

    @override 
    _MyFormState createState() => new _MyFormState(); 
} 

class _MyFormState extends State<MyForm> { 
    String value = "foo"; 

    @override 
    Widget build(BuildContext context) { 
    return new SimpleDialog(
     title: new Text("My form"), 
     children: <Widget>[ 
     new Radio(
      groupValue: value, 
      onChanged: (value) => setState(() => this.value = value), 
      value: "foo", 
     ), 
     new Radio(
      groupValue: value, 
      onChanged: (value) => setState(() => this.value = value), 
      value: "bar", 
     ), 
     new FlatButton(
      onPressed:() { 
      Navigator.pop(context); 
      widget.onSubmit(value); 
      }, 
      child: new Text("submit"), 
     ) 
     ], 
    ); 
    } 
}