UnityTech / UIWidgets

UIWidget is a Unity Package which helps developers to create, debug and deploy efficient, cross-platform Apps.
Other
1.97k stars 256 forks source link

Inconsistent Stack widget performance #461

Open RF103T opened 3 years ago

RF103T commented 3 years ago

When I use the stack widget like in flutter, I can't dynamically modify the children property to change the z-order of the child widgets.

The following code can achieve the effect in flutter, but it has no effect in UIWidgets.

我像 flutter 中那样使用 Stack widget 时,发现我不能动态修改children属性来改变子widget的前后顺序。

以下代码可以在flutter中实现效果,但在UIWidgets中没有效果。

flutter

class MyHomePage extends StatefulWidget {
  final String title;
  MyHomePage({Key? key, required this.title}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  var children = <Widget>[
    Positioned(
        top: 100,
        left: 100,
        child: Container(height: 100, width: 100, color: Colors.blue)),
    Positioned(
        top: 120,
        left: 120,
        child: Container(height: 100, width: 100, color: Colors.red))
  ];

  void _incrementCounter() {
    setState(() {
      var temp = children[0];
      children[0] = children[1];
      children[1] = temp;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(child: Stack(children: children)),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

C#

class MainUI : StatefulWidget
{
    public MainUI(Key key = null) : base(key) { }

    public override State createState()
    {
        return new MainUIState();
    }
}

class MainUIState: State<MainUI>
{
    int counter = 0;

    public override Widget build(BuildContext context)
    {
        List<Widget> widgets = new List<Widget>()
        {
            new Positioned(
            top: 100,
            left: 100,
            child: new Container(height : 100, width : 100, color : Colors.blue)),
            new Positioned(
            top: 120,
            left: 120,
            child: new Container(height : 100, width : 100, color : Colors.red))
        };

        return new ConstrainedBox(
            constraints: BoxConstraints.expand(),
            child: new Stack(
                children : new List<Widget>()
                {
                    new Column(
                            children: new List<Widget>()
                            {
                                new Expanded(
                                        child: new Row(
                                            crossAxisAlignment : CrossAxisAlignment.start,
                                            children : new List<Widget>()
                                            {
                                                new RaisedButton(
                                                    onPressed: () =>
                                                    {
                                                        this.setState(() =>
                                                        {
                                                            Widget temp = widgets[0];
                                                            widgets[0] = widgets[1];
                                                            widgets[1] = temp;
                                                        });
                                                    },
                                                    child : new Text("交换")
                                                )
                                            }
                                        )
                                    )
                            }
                        ),
                        new Stack(
                            children: widgets
                        )
                }
            )
        );
    }
}