Unity基于UIWidgets的UI入门（四简单的入门 Redux 架构应用实践）_unity ui weight

Redux架构 是根据flutter来的

然后这节课是学习 TodoListApp 配置 Redux

添加 类TodoViewState

  public class TodoViewState
    {
        public TodoListApp.TodoListPageMode toDoListPageMode = TodoListApp.TodoListPageMode.List;
    }

然后修改 TodoListApp 类中的 createWidget方法

 protected override Widget createWidget()
        {
            var appWidget = new MaterialApp(home:
                new Scaffold(
                    appBar: new AppBar(title: new Center(child: FQ.Text.Data("My App").SetSize(20).EndText()),
                     backgroundColor: Color.black,
                     // leading: new Icon(Icons.home),
                     actions: new List<Widget>(){
                        new IconButton(icon:  new Icon(Icons.image,color:Colors.white)),
                        new IconButton(icon:  new Icon(Icons.image,color:Colors.white)),
                        new PopupMenuButton<Choice>(
                            onSelected: (choice)=> { Debug.Log(choice.title); },
                            itemBuilder: (BuildContext subContext) => {
                                List<PopupMenuEntry<Choice>> popupItems = new List<PopupMenuEntry<Choice>>();
                                for (int i = 0; i < Choice.choices.Count; i++) {
                                    popupItems.Add(new PopupMenuItem<Choice>(
                                        value: Choice.choices[i],
                                        child: new Text(Choice.choices[i].title)));
                                }
                                return popupItems;
                            }
                        )
                     }),
                     drawer: new Drawer(
                         child: FQ.ListView.Padding(EdgeInsets.zero).
                         Child(new Divider()).
                         Child(new ListTile(leading: new Icon(Icons.list),
                               title: FQ.Text.Data("代办事项").EndText(), onTap: () =>
                               {
                                   ViewState.todoListPageMode = TodoListPageMode.List;
                                   Debug.Log("点击了待办事项");
                                   ViewState.OnStateChange.Invoke();
                               })).
                               Child(new Divider()).
                               Child(new ListTile(
                                leading: new Icon(Icons.check_box),
                                title: FQ.Text.Data("已完成事项").EndText(), onTap: () =>
                               {
                                   Debug.Log("点击了已完成");
                                   ViewState.todoListPageMode = TodoListPageMode.Finished;
                                   ViewState.OnStateChange.Invoke();
                               })
                                ).Child(new Divider())
                             .EndListView()
                     ),
                    body: new TodoListPage(),
 
                    floatingActionButton: new FloatingActionButton(
                    backgroundColor: Colors.redAccent,
                    child: new Icon(Unity.UIWidgets.material.Icons.add_alert),
                    onPressed: () => { Debug.Log("OnbuttonClick"); }
 
                       )
             ));
            var store = new Store<TodoViewState>(reducer: (TodoViewState previousState, object action) =>
            {
                return previousState;
            }, initialState: new TodoViewState());
            var provider = new StoreProvider<TodoViewState>(store: store, child: appWidget);
 
            return provider;
            //return appWidget;
        }

现在就编译通过啦！

接着我们学习 使用 Redux 重构列表间的切换功能

这节课有点难理解

记住这样用就行 改的地方有点多 TodolistApp类的 createWidget方法

和 TodoListState的 build方法 我先把代码贴出来

这个类用来扩展UIWidgets

using System;
using System.Globalization;
using System.Collections;
using System.Collections.Generic;
using Unity.UIWidgets.gestures;
using Unity.UIWidgets.painting;
using Unity.UIWidgets.widgets;
using UnityEngine;
using Color = Unity.UIWidgets.ui.Color;
using Unity.UIWidgets.foundation;
using Unity.UIWidgets.material;
 
namespace MyTestUIWidgets.UIWidgets
{
    public class FQ
    {
        public static ContainerBuild Container => new ContainerBuild();
        public static TextBuilder Text => new TextBuilder();
        public static ListViewBuilder ListView => new ListViewBuilder();
        public static EditableTextBuilder EditableText => new EditableTextBuilder();
    }
 
    public class ContainerBuild
    {
        private Widget mChild { get; set; }
        private Alignment mAlignment { get; set; }
        private Color mColor { get; set; }
        private EdgeInsets mMargin = EdgeInsets.zero;
        //可空参数
        private float? mWidth = null;
        private float? mHeight = null;
        public static ContainerBuild GetBuilder()
        {
            return new ContainerBuild();
        }
        public ContainerBuild Child(Widget _child)
        {
            mChild = _child;
            return this;
        }
        public ContainerBuild Color(Color _color)
        {
            mColor = _color;
            return this;
        }
        public ContainerBuild Margin(EdgeInsets _edgInsets)
        {
            mMargin = _edgInsets;
            return this;
        }
        public ContainerBuild Width(float _width)
        {
            mWidth = _width;
            return this;
        }
        public ContainerBuild Height(float height)
        {
            mHeight = height;
            return this;
        }
        public ContainerBuild Alignment(Alignment _alignment)
        {
            mAlignment = _alignment;
            return this;
        }
        private Color mBorderColor = null;
        public ContainerBuild Dec(Color color)
        {
            mBorderColor = color;
 
            return this;
        }
        public Container EndContainer()
        {
            return new Container(child: mChild,
             alignment: mAlignment,
              color: mColor,
              width: mWidth,
              height:mHeight,
               margin: mMargin,
               decoration:
               mBorderColor != null ? new BoxDecoration(border: Border.all(mBorderColor)) : null);
        }
    }
    public class TextBuilder
    {
        private string mData { get; set; }
        private TextStyle mStyle { get; set; } = new TextStyle();
        private int mFontSize { get; set; }
        public static TextBuilder GetBuilder()
        {
            return new TextBuilder();
        }
        public TextBuilder Data(string _data)
        {
            mData = _data;
            return this;
        }
        public TextBuilder SetTextStyle(TextStyle _style)
        {
            mStyle = _style;
            return this;
        }
        public TextBuilder SetSize(int _fountSize)
        {
            mFontSize = _fountSize;
            return this;
        }
        public Text EndText()
        {
            if (mFontSize == 0)
            {
                return new Text(data: mData);
            }
            else
            {
                return new Text(data: mData, style: new TextStyle(fontSize: mFontSize));
            }
        }
    }
    public class ListViewBuilder
    {
        List<Widget> mChildren = new List<Widget>();
        EdgeInsets mPadding = null;
        public static ListViewBuilder GetBuilder()
        {
            return new ListViewBuilder();
        }
        public ListViewBuilder Padding(EdgeInsets _madding)
        {
            mPadding = _madding;
            return this;
        }
        public ListViewBuilder Child(List<Widget> _children)
        {
            mChildren = _children;
            return this;
        }
        public ListViewBuilder Child(Widget _child)
        {
            mChildren.Add(_child);
            return this;
        }
        public ListViewBuilder Child(params Widget[] _childeen)
        {
            mChildren.AddRange(_childeen);
            return this;
        }
        public ListView EndListView()
        {
            return new ListView(children: mChildren, padding: mPadding);
        }
    }
    public static class GestureDetectorExtension
    {
        public static GestureDetector OnTap(this Widget _widget, GestureTapCallback onTap)
        {
            return new GestureDetector(child: _widget, onTap: onTap);
        }
    }
    public class EditableTextBuilder
    {
        private TextEditingController mInputController = new TextEditingController(text: "");
        private FocusNode mFocusNode = new FocusNode();
        public TextStyle mStyle = new TextStyle();
        public Color mCursorColor = Color.black;
        public float mFontSize;
        ValueChanged<string> mOnValueChanged = null;
        ValueChanged<string> mOnSubmit = null;
        public EditableTextBuilder OnValueChanged(ValueChanged<string> _onValueChanged)
        {
            mOnValueChanged = _onValueChanged;
            return this;
        }
        public EditableTextBuilder OnSubmit(ValueChanged<string> _onSubmit)
        {
            mOnSubmit = _onSubmit;
            return this;
        }
        public EditableTextBuilder SetInputController(TextEditingController _inputController, FocusNode _focusNode, TextStyle _style, Color _cursorColor)
        {
            mInputController = _inputController;
            mFocusNode = _focusNode;
            mStyle = _style;
            mCursorColor = _cursorColor;
            return this;
        }
        public EditableTextBuilder FontSize(float size)
        {
            mFontSize = size;
            return this;
        }
        public EditableTextBuilder GetBuilder()
        {
            return new EditableTextBuilder();
        }
        public EditableText EndEditableTextBuilder()
        {
            return new EditableText(
                controller: mInputController,
                 focusNode: mFocusNode,
                 style: mFontSize == 0 ? mStyle : new TextStyle(fontSize: mFontSize),
                 cursorColor: mCursorColor,
                 onChanged: mOnValueChanged,
                 onSubmitted: mOnSubmit);
        }
    }
 
}

项目中的扩展方法

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using UnityEngine;
namespace MyTestUIWidgets.UIWidgets
{
    public class TodoViewState
    {
        public TodoListApp.TodoListPageMode toDoListPageMode = TodoListApp.TodoListPageMode.List;
    }
 
    public class Todo
    {
        public string Content = string.Empty;
        public bool Finished = false;
    }
    public static class Model
    {
        public static List<Todo> Load()
        {
            //PlayerPrefs.DeleteAll();
            var toDoListContent = PlayerPrefs.GetString("TODO_LIST_KEY", string.Empty);
            var splitDatas = toDoListContent.Split(new[] { "@@@@" }, StringSplitOptions.None);
            return splitDatas.Where(data => !string.IsNullOrEmpty(data))
            .Select(toddData =>
            {
                var todo = new Todo();
                var todoSplitDatas = toddData.Split(new[] { "::::" }, StringSplitOptions.None);
                todo.Content = todoSplitDatas[0];
                if (todoSplitDatas.Length > 1)
                {
                    todo.Finished = bool.Parse(todoSplitDatas[1]);
                }
                return todo;
            })
            .ToList();
        }
        public static void Save(this List<Todo> self)
        {
            StringBuilder stringBuilder = new StringBuilder();
            self.ForEach(
                data =>
                {
                    stringBuilder.Append(data.Content);
                    stringBuilder.Append("::::");
                    stringBuilder.Append(data.Finished);
                    stringBuilder.Append("@@@@");
                }
            );
            PlayerPrefs.SetString("TODO_LIST_KEY", stringBuilder.ToString());
        }
    }
}

列表类

 
using Color = Unity.UIWidgets.ui.Color;
using Unity.UIWidgets.foundation;
using System;
using System.Collections.Generic;
using MyTestUIWidgets.UIWidgets;
using Unity.UIWidgets.painting;
using Unity.UIWidgets.widgets;
using UnityEngine;
using Unity.UIWidgets.material;
 
namespace MyTestUIWidgets.UIWidgets
{
    public class TodoView : StatelessWidget
    {
        private readonly Todo mData;
        private readonly Action mOnFinish;
        private readonly Action mDelete;
        private readonly IconData mIcon;
        public TodoView(Todo data, Action onFinish, Action onDelete,IconData icon)
        {
            mData = data;
            mOnFinish = onFinish;
            mDelete = onDelete;
            mIcon=icon;
        }
        public override Widget build(BuildContext context)
        {
            return
            new ListTile(
 
                leading: new IconButton(icon: new Icon(icon: mIcon /* Icons.check_box_outline_blank */, color: Colors.blueAccent, size: 30), onPressed: () => { mOnFinish(); },iconSize:50),
                // .OnTap(() =>
                // {
 
                // }),
                // leading: new Text(data : "我是领导标题"),
                subtitle: new Text(data: DateTime.Now.ToString("yyyy年 m月 d日 HH:mm:ss ")),
                //trailing : new Text(data : "我是补充说明"),
                trailing: new IconButton(icon: new Icon(icon: Icons.delete_outline, color: Colors.redAccent, size: 30), onPressed: () => { mDelete(); },iconSize:50),
                // .OnTap(() =>
                //   {
                //       mDelete();
                //       // mOnFinish();
                //   }),
                title: FQ.Text.Data(mData.Content).SetSize(30).EndText());
            //  FQ.Container
            //         .Alignment(Alignment.center)
            //         .Child(
            //             FQ.Text
            //             .Data(mData)
            //             .SetSize(20).EndText()
            //         )
            //     .EndContainer().OnTap(() =>
            //     {
            //         mOnFinish();
            //     }));
        }
    }
    public class TodoInputView : StatelessWidget
    {
        private string mInputContent = string.Empty;
 
        private Action<string> mOnAdd;
        public TodoInputView(Action<string> onAdd)
        {
            mOnAdd = onAdd;
        }
        public void AddTodo()
        {
            if (!string.IsNullOrWhiteSpace(mInputContent))
            {
                mOnAdd(mInputContent);
            }
        }
        public override Widget build(BuildContext context)
        {
            return
            new Container(child:
                new Row(children: new List<Widget>(){
                    FQ.Container.Width(190).Height( 40 ).Dec(Colors.lightBlue).Margin(EdgeInsets.only(left :60))
                    .Child(FQ.EditableText.FontSize(30)
                            .OnValueChanged(mInputContent => { this.mInputContent = mInputContent; } )
                            .OnSubmit(inputvalue => AddTodo())
                            .EndEditableTextBuilder())
                            .EndContainer(),
                            new IconButton( icon: new Icon(Icons.add_box,size:40,color:Colors.green),onPressed:AddTodo),
                    // FQ.Container.Child(
                    //  new Icon(Icons.add_box,size:40,color:Colors.green)
                    // .OnTap(() => {
                    //     AddTodo();
                    //  Debug.Log("On Tap");})
                    //         ).Margin(EdgeInsets.only(left:30)).EndContainer()
                    }
            ));
        }
    }
}
 

这个类用来管理绘制UIPanel

using System.Runtime.CompilerServices;
using System.Xml.Linq;
using System;
using System.Text;
using System.Linq;
using System.Collections;
using System.Collections.Generic;
using Unity.UIWidgets.engine;
using Unity.UIWidgets.painting;
using Unity.UIWidgets.widgets;
using UnityEngine;
using Color = Unity.UIWidgets.ui.Color;
using MyTestUIWidgets.UIWidgets;
using Unity.UIWidgets.foundation;
using Unity.UIWidgets.animation;
using Unity.UIWidgets.material;
using Unity.UIWidgets.ui;
using UnityEditor;
using Unity.UIWidgets.Redux;
using Unity.UIWidgets;
 
namespace MyTestUIWidgets
{
    class Choice
    {
        public Choice(string title, IconData icon)
        {
            this.title = title;
            this.icon = icon;
        }
        public readonly string title;
        public readonly IconData icon;
        public static List<Choice> choices = new List<Choice> {
            new Choice("Car", Unity.UIWidgets.material.Icons.directions_car),
            new Choice("Bicycle", Unity.UIWidgets.material.Icons.directions_bike),
            new Choice("Boat", Unity.UIWidgets.material.Icons.directions_boat),
            new Choice("Bus", Unity.UIWidgets.material.Icons.directions_bus),
            new Choice("Train", Unity.UIWidgets.material.Icons.directions_railway),
            new Choice("Walk", Unity.UIWidgets.material.Icons.directions_walk)
        };
    }
    public class TodoListApp : UIWidgetsPanel
    {
        protected override void OnEnable()
        {
            base.OnEnable();
            FontManager.instance.addFont(Resources.Load<Font>("MaterialIcons-Regular"), "Material Icons", fontWeight: FontWeight.normal);
            FontManager.instance.addFont(Resources.Load<Font>("GalleryIcons"), "GalleryIcons");
 
        }
        protected override Widget createWidget()
        {
            var appWidget = new MaterialApp(home:
                new Scaffold(
                    appBar: new AppBar(title: new Center(child: FQ.Text.Data("My App").SetSize(20).EndText()),
                     backgroundColor: Color.black,
                     // leading: new Icon(Icons.home),
                     actions: new List<Widget>(){
                        new IconButton(icon:  new Icon(Icons.image,color:Colors.white)),
                        new IconButton(icon:  new Icon(Icons.image,color:Colors.white)),
                        new PopupMenuButton<Choice>(
                            onSelected: (choice)=> { Debug.Log(choice.title); },
                            itemBuilder: (BuildContext subContext) => {
                                List<PopupMenuEntry<Choice>> popupItems = new List<PopupMenuEntry<Choice>>();
                                for (int i = 0; i < Choice.choices.Count; i++) {
                                    popupItems.Add(new PopupMenuItem<Choice>(
                                        value: Choice.choices[i],
                                        child: new Text(Choice.choices[i].title)));
                                }
                                return popupItems;
                            }
                        )
                     }),
                     drawer: new Drawer(
                         child: FQ.ListView.Padding(EdgeInsets.zero).
                         Child(new Divider()).
                         Child(
                             new StoreConnector<TodoViewState, object>(
                                 converter: (state) => null,
                                 builder: (context, Model, disoatcher) =>
                                 {
                                     return new ListTile(leading: new Icon(Icons.list),
                                     title: FQ.Text.Data("代办事项").EndText(), onTap: () =>
                                     {
                                         disoatcher.dispatch("LIST_PAGE_MODE");
                                         //  ViewState.todoListPageMode = TodoListPageMode.List;
                                         //  Debug.Log("点击了待办事项");
                                         //  ViewState.OnStateChange.Invoke();
                                     });
                                 }
                                )
                             ).
                               Child(new Divider()).
                               Child(
                                    new StoreConnector<TodoViewState, object>(
                                 converter: (state) => null,
                                 builder: (context, Model, disoatcher) =>
                                 {
                                     return new ListTile(
                                leading: new Icon(Icons.check_box),
                                title: FQ.Text.Data("已完成事项").EndText(), onTap: () =>
                               {
                                   disoatcher.dispatch("FINISH_PAGE_MODE");
                                   //    Debug.Log("点击了已完成");
                                   //    ViewState.todoListPageMode = TodoListPageMode.Finished;
                                   //    ViewState.OnStateChange.Invoke();
                               });
                                 })).Child(new Divider())
                             .EndListView()
                     ),
                    body: new TodoListPage(),
 
                    floatingActionButton: new FloatingActionButton(
                        backgroundColor: Colors.redAccent,
                        child: new Icon(Unity.UIWidgets.material.Icons.add_alert),
                        onPressed: () => { Debug.Log("OnbuttonClick"); }
                       )
             ));
            var store = new Store<TodoViewState>(reducer: (TodoViewState previousState, object action) =>
            {
                Debug.Log(action);
                switch (action)
                {
                    case "LIST_PAGE_MODE":
                        return new TodoViewState() { toDoListPageMode = TodoListPageMode.List };
                    case "FINISH_PAGE_MODE":
                        return new TodoViewState() { toDoListPageMode = TodoListPageMode.Finished };
                }
                return previousState;
            }, initialState: new TodoViewState());
            var provider = new StoreProvider<TodoViewState>(store: store, child: appWidget);
            return provider;
            //return appWidget;
        }
 
        class TodoListPage : StatefulWidget
        {
            public override State createState()
            {
                return new TodoListState();
            }
        }
        public enum TodoListPageMode
        {
            List,
            Finished
        }
        class TodoListState : State<TodoListPage>
        {
            public override void initState()
            {
                mTodoDatas = Model.Load();
            }
            void OnChange()
            {
                this.setState(() => { });
            }
            private List<Todo> mTodoDatas = null;
            public override Widget build(BuildContext context)
            {
 
                return new StoreConnector<TodoViewState, TodoListPageMode>(converter: state => state.toDoListPageMode, builder: (buildContext, model, DispatcherImpl) =>
                 {
                     if (model == TodoListPageMode.List)
                     {
                         return FQ.ListView
                         //.Child(new Text(data: "哈哈哈哈哈"))
                         .Child(new TodoInputView(data => { AddState(data); }))
                         .Child(ListTodoViews)
                         .Padding(EdgeInsets.only(0, 50))
                         .EndListView();
                     }
                     else
                     {
                        return FQ.ListView
                        //.Child(new Text(data: "哈哈哈哈哈"))
                        //.Child(new TodoInputView(data => { AddState(data); }))
                        .Child(FinishedListView)
                        .Padding(EdgeInsets.only(0, 50))
                        .EndListView();
                     }
                 });
            }
            private void AddState(string data)
            {
                this.setState(() =>
                {
                    mTodoDatas.Add(new Todo() { Content = data, Finished = false });
                    Save();
                });
            }
            private void Save()
            {
                mTodoDatas.Save();
            }
            Widget[] FinishedListView
            {
                get
                {
                    var retWidgets = new List<Widget>();
                    foreach (var data in mTodoDatas.Where(data => data.Finished))
                    {
                        retWidgets.Add(new TodoView(data, () =>
                        {
                            this.setState(() =>
                            {
                                Debug.Log(data.Finished + "未设置");
                                data.Finished = false;
                                Debug.Log(data.Finished + "设置后");
                            });
                            Save();
                        },
                            () =>
                            {
                                this.setState(() =>
                                {
                                    mTodoDatas.Remove(data);
                                    Save();
                                });
                            },Icons.check_box));
                        retWidgets.Add(new Divider());
                    }
                    return retWidgets.ToArray();
                }
            }
            Widget[] ListTodoViews
            {
                get
                {
                    var retWidgets = new List<Widget>();
                    foreach (var data in mTodoDatas.Where(data => !data.Finished))
                    {
                        retWidgets.Add(new TodoView(data, () =>
                        {
                            this.setState(() =>
                            {
                                Debug.Log(data.Finished + "未设置");
                                data.Finished = true;
                                Debug.Log(data.Finished + "设置后");
                            });
                            Save();
                        },
                            () =>
                            {
                                this.setState(() =>
                                {
                                    mTodoDatas.Remove(data);
                                    Save();
                                });
                            },Icons. check_box_outline_blank));
                        retWidgets.Add(new Divider());
                    }
                    return retWidgets.ToArray();
                    //     return mTodoDatas.Where(data => !data.Finished).Select(data => new TodoView(data, () =>
                    //    {
                    //        this.setState(() =>
                    //        {
                    //            Debug.Log(data.Finished + "未设置");
                    //            data.Finished = true;
                    //            Debug.Log(data.Finished + "设置后");
                    //        });
                    //        Save();
                    //    }, () =>
                    //    {
                    //        this.setState(() =>
                    //        {
                    //            mTodoDatas.Remove(data);
                    //            Save();
                    //        });
                    //    })).ToArray();
                }
            }
        }
    }
}
 

 Redux 中的单向数据流介绍

Redux 风格的文件夹整理

这种重构我有点不理解，现在用不到，也没做深入的研究

使用 Redux 重构 Todo 的完成和删除功能

中间件（Middleware）的使用与存储功能实现 （ 还是在Store构造的时候传入的）

使用 redux-thunk 中间件完成异步 action 的处理

这几节课学的我是云里雾里的。。熬

重构我直接贴代码了 新建一个文件夹叫Store

新建类Actions

Reducers

SaveMiddleware

TodoViewState

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using UnityEngine;
namespace MyTestUIWidgets.UIWidgets
{
    ///用来
    public class TodoViewState
    {
        public TodoListPageMode toDoListPageMode = TodoListPageMode.List;
        public List<Todo> TodoDatas = new List<Todo>();
    }
}

using Unity.UIWidgets;
using UnityEngine;
using MyTestUIWidgets;
namespace MyTestUIWidgets.UIWidgets
{
    public class SaveMiddleware
    {
        public static Middleware<State> create<State>() where State : TodoViewState
        {
            return (store) => (next) => new DispatcherImpl((action) =>
            {
                var previousState = store.getState();
                if (previousState == default)
                {
                    previousState.TodoDatas = Model.Load();
                }
                var result = next.dispatch(action);
                var afterState = store.getState();
                afterState.TodoDatas.Save();
                return result;
            });
        }
    }
}

using System.Linq;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
 
namespace MyTestUIWidgets.UIWidgets
{
    public class Reducers : MonoBehaviour
    {
        public static TodoViewState Reduce(TodoViewState previousState, object action)
        {
            //Debug.Log(action);
            switch (action)
            {
                case ListPageModeAction _:
                    return new TodoViewState() { toDoListPageMode = TodoListPageMode.List, TodoDatas = previousState.TodoDatas };
                case FinishedPageModeAction _:
                    return new TodoViewState() { toDoListPageMode = TodoListPageMode.Finished, TodoDatas = previousState.TodoDatas };
                case AddTodoAction addTodoAction:
                    var previousTodos = previousState.TodoDatas;
                    previousTodos.Add(new Todo()
                    {
                        Content = addTodoAction.TodoContent
                    });
                    return new TodoViewState()
                    {
                        toDoListPageMode = previousState.toDoListPageMode,
                        TodoDatas = previousTodos
                    };
                case DeleteTodoAction deleteTodoAction:
                    return new TodoViewState()
                    {
                        toDoListPageMode = previousState.toDoListPageMode,
                        TodoDatas = previousState.TodoDatas.Where(todo => todo != deleteTodoAction.mTodo).ToList()
                    };
                case FinishTodoAction finishTodoAction:
                    return new TodoViewState()
                    {
                        toDoListPageMode = previousState.toDoListPageMode,
                        TodoDatas = previousState.TodoDatas.
                        Select(todo =>
                        {
                            if (todo == finishTodoAction.mTodo)
                            {
                                todo.Finished = true;
                            }
                            return todo;
                        }).ToList()
                    };
                case NetworkRequestAction networkRequestAction:
                    Debug.Log(networkRequestAction.Result);
                    return previousState;
            }
            return previousState;
        }
    }
}

using System.Net.Http;
using Unity.UIWidgets.Redux;
using Unity.UIWidgets.ui;
 
namespace MyTestUIWidgets.UIWidgets
{
 
    public class ListPageModeAction
    {
    }
    public class FinishedPageModeAction
    {
    }
    public class AddTodoAction
    {
        public string TodoContent { get; }
        public AddTodoAction(string todoContent)
        {
            TodoContent = todoContent;
        }
    }
    public class DeleteTodoAction
    {
        public readonly Todo mTodo;
        public DeleteTodoAction(Todo todo)
        {
            mTodo = todo;
        }
 
    }
    public class FinishTodoAction
    {
        public readonly Todo mTodo;
        public FinishTodoAction(Todo todo)
        {
            mTodo = todo;
        }
 
    }
    public class NetworkRequestAction
    {
        public string Result { get; set; }
        public static ThunkAction<TodoViewState> Create()
        {
            return new ThunkAction<TodoViewState>(action: (dispatcher, getState) =>
            {
                 
                var client = new HttpClient();
                var task = client.GetAsync("http://baidu.com");
                task.GetAwaiter().OnCompleted(() =>
                {
                    var contentTsak = task.Result.Content.ReadAsStringAsync();
                    contentTsak.GetAwaiter().OnCompleted(() =>
                    {
                        dispatcher.dispatch(new NetworkRequestAction()
                        {
                            Result = contentTsak.Result
                        });
                    });
                });
                return null;
            });
        }
    }
}

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using UnityEngine;
namespace MyTestUIWidgets.UIWidgets
{
 
    public class Todo
    {
        public string Content = string.Empty;
        public bool Finished = false;
    }
    public static class Model
    {
        public static List<Todo> Load()
        {
            //PlayerPrefs.DeleteAll();
            var toDoListContent = PlayerPrefs.GetString("TODO_LIST_KEY", string.Empty);
            var splitDatas = toDoListContent.Split(new[] { "@@@@" }, StringSplitOptions.None);
            return splitDatas.Where(data => !string.IsNullOrEmpty(data))
            .Select(toddData =>
            {
                var todo = new Todo();
                var todoSplitDatas = toddData.Split(new[] { "::::" }, StringSplitOptions.None);
                todo.Content = todoSplitDatas[0];
                if (todoSplitDatas.Length > 1)
                {
                    todo.Finished = bool.Parse(todoSplitDatas[1]);
                }
                return todo;
            })
            .ToList();
        }
        public static void Save(this List<Todo> self)
        {
            StringBuilder stringBuilder = new StringBuilder();
            self.ForEach(
                data =>
                {
                    stringBuilder.Append(data.Content);
                    stringBuilder.Append("::::");
                    stringBuilder.Append(data.Finished);
                    stringBuilder.Append("@@@@");
                }
            );
            PlayerPrefs.SetString("TODO_LIST_KEY", stringBuilder.ToString());
        }
    }
}

 
using Color = Unity.UIWidgets.ui.Color;
using Unity.UIWidgets.foundation;
using System;
using System.Collections.Generic;
using MyTestUIWidgets.UIWidgets;
using Unity.UIWidgets.painting;
using Unity.UIWidgets.widgets;
using UnityEngine;
using Unity.UIWidgets.material;
 
namespace MyTestUIWidgets.UIWidgets
{
    public class TodoView : StatelessWidget
    {
        private readonly Todo mData;
        private readonly Action mOnFinish;
        private readonly Action mDelete;
        private readonly IconData mIcon;
        public TodoView(Todo data, Action onFinish, Action onDelete, IconData icon)
        {
            mData = data;
            mOnFinish = onFinish;
            mDelete = onDelete;
            mIcon = icon;
        }
        public override Widget build(BuildContext context)
        {
            return
            new ListTile(
 
                leading: new IconButton(icon: new Icon(icon: mIcon /* Icons.check_box_outline_blank */, color: Colors.blueAccent, size: 30), onPressed: () => { mOnFinish(); }, iconSize: 50),
                // .OnTap(() =>
                // {
 
                // }),
                // leading: new Text(data : "我是领导标题"),
                subtitle: new Text(data: DateTime.Now.ToString("yyyy年 m月 d日 HH:mm:ss ")),
                //trailing : new Text(data : "我是补充说明"),
                trailing: new IconButton(icon: new Icon(icon: Icons.delete_outline, color: Colors.redAccent, size: 30), onPressed: () => { mDelete(); }, iconSize: 50),
                // .OnTap(() =>
                //   {
                //       mDelete();
                //       // mOnFinish();
                //   }),
                title: FQ.Text.Data(mData.Content).SetSize(30).EndText());
            //  FQ.Container
            //         .Alignment(Alignment.center)
            //         .Child(
            //             FQ.Text
            //             .Data(mData)
            //             .SetSize(20).EndText()
            //         )
            //     .EndContainer().OnTap(() =>
            //     {
            //         mOnFinish();
            //     }));
        }
    }
    public class TodoInputView : StatelessWidget
    {
        private string mInputContent = string.Empty;
 
        private Action<string> mOnAdd;
        public TodoInputView(Action<string> onAdd)
        {
            mOnAdd = onAdd;
        }
        public void AddTodo()
        {
            if (!string.IsNullOrWhiteSpace(mInputContent))
            {
                mOnAdd(mInputContent);
            }
        }
        public override Widget build(BuildContext context)
        {
            return
            new Container(child:
                new Row(children: new List<Widget>(){
                    FQ.Container.Width(190).Height( 40 ).Dec(Colors.lightBlue).Margin(EdgeInsets.only(left :60))
                    .Child(FQ.EditableText.FontSize(30)
                            .OnValueChanged(mInputContent => { this.mInputContent = mInputContent; } )
                            .OnSubmit(inputvalue => AddTodo())
                            .EndEditableTextBuilder())
                            .EndContainer(),
                            new IconButton( icon: new Icon(Icons.add_box,size:40,color:Colors.green),onPressed:AddTodo),
                    }
            ));
        }
    }
}
 

using System;
using System.Globalization;
using System.Collections;
using System.Collections.Generic;
using Unity.UIWidgets.gestures;
using Unity.UIWidgets.painting;
using Unity.UIWidgets.widgets;
using UnityEngine;
using Color = Unity.UIWidgets.ui.Color;
using Unity.UIWidgets.foundation;
using Unity.UIWidgets.material;
 
namespace MyTestUIWidgets.UIWidgets
{
    public class FQ
    {
        public static ContainerBuild Container => new ContainerBuild();
        public static TextBuilder Text => new TextBuilder();
        public static ListViewBuilder ListView => new ListViewBuilder();
        public static EditableTextBuilder EditableText => new EditableTextBuilder();
    }
 
    public class ContainerBuild
    {
        private Widget mChild { get; set; }
        private Alignment mAlignment { get; set; }
        private Color mColor { get; set; }
        private EdgeInsets mMargin = EdgeInsets.zero;
        //可空参数
        private float? mWidth = null;
        private float? mHeight = null;
        public static ContainerBuild GetBuilder()
        {
            return new ContainerBuild();
        }
        public ContainerBuild Child(Widget _child)
        {
            mChild = _child;
            return this;
        }
        public ContainerBuild Color(Color _color)
        {
            mColor = _color;
            return this;
        }
        public ContainerBuild Margin(EdgeInsets _edgInsets)
        {
            mMargin = _edgInsets;
            return this;
        }
        public ContainerBuild Width(float _width)
        {
            mWidth = _width;
            return this;
        }
        public ContainerBuild Height(float height)
        {
            mHeight = height;
            return this;
        }
        public ContainerBuild Alignment(Alignment _alignment)
        {
            mAlignment = _alignment;
            return this;
        }
        private Color mBorderColor = null;
        public ContainerBuild Dec(Color color)
        {
            mBorderColor = color;
 
            return this;
        }
        public Container EndContainer()
        {
            return new Container(child: mChild,
             alignment: mAlignment,
              color: mColor,
              width: mWidth,
              height:mHeight,
               margin: mMargin,
               decoration:
               mBorderColor != null ? new BoxDecoration(border: Border.all(mBorderColor)) : null);
        }
    }
    public class TextBuilder
    {
        private string mData { get; set; }
        private TextStyle mStyle { get; set; } = new TextStyle();
        private int mFontSize { get; set; }
        public static TextBuilder GetBuilder()
        {
            return new TextBuilder();
        }
        public TextBuilder Data(string _data)
        {
            mData = _data;
            return this;
        }
        public TextBuilder SetTextStyle(TextStyle _style)
        {
            mStyle = _style;
            return this;
        }
        public TextBuilder SetSize(int _fountSize)
        {
            mFontSize = _fountSize;
            return this;
        }
        public Text EndText()
        {
            if (mFontSize == 0)
            {
                return new Text(data: mData);
            }
            else
            {
                return new Text(data: mData, style: new TextStyle(fontSize: mFontSize));
            }
        }
    }
    public class ListViewBuilder
    {
        List<Widget> mChildren = new List<Widget>();
        EdgeInsets mPadding = null;
        public static ListViewBuilder GetBuilder()
        {
            return new ListViewBuilder();
        }
        public ListViewBuilder Padding(EdgeInsets _madding)
        {
            mPadding = _madding;
            return this;
        }
        public ListViewBuilder Child(List<Widget> _children)
        {
            mChildren = _children;
            return this;
        }
        public ListViewBuilder Child(Widget _child)
        {
            mChildren.Add(_child);
            return this;
        }
        public ListViewBuilder Child(params Widget[] _childeen)
        {
            mChildren.AddRange(_childeen);
            return this;
        }
        public ListView EndListView()
        {
            return new ListView(children: mChildren, padding: mPadding);
        }
    }
    public static class GestureDetectorExtension
    {
        public static GestureDetector OnTap(this Widget _widget, GestureTapCallback onTap)
        {
            return new GestureDetector(child: _widget, onTap: onTap);
        }
    }
    public class EditableTextBuilder
    {
        private TextEditingController mInputController = new TextEditingController(text: "");
        private FocusNode mFocusNode = new FocusNode();
        public TextStyle mStyle = new TextStyle();
        public Color mCursorColor = Color.black;
        public float mFontSize;
        ValueChanged<string> mOnValueChanged = null;
        ValueChanged<string> mOnSubmit = null;
        public EditableTextBuilder OnValueChanged(ValueChanged<string> _onValueChanged)
        {
            mOnValueChanged = _onValueChanged;
            return this;
        }
        public EditableTextBuilder OnSubmit(ValueChanged<string> _onSubmit)
        {
            mOnSubmit = _onSubmit;
            return this;
        }
        public EditableTextBuilder SetInputController(TextEditingController _inputController, FocusNode _focusNode, TextStyle _style, Color _cursorColor)
        {
            mInputController = _inputController;
            mFocusNode = _focusNode;
            mStyle = _style;
            mCursorColor = _cursorColor;
            return this;
        }
        public EditableTextBuilder FontSize(float size)
        {
            mFontSize = size;
            return this;
        }
        public EditableTextBuilder GetBuilder()
        {
            return new EditableTextBuilder();
        }
        public EditableText EndEditableTextBuilder()
        {
            return new EditableText(
                controller: mInputController,
                 focusNode: mFocusNode,
                 style: mFontSize == 0 ? mStyle : new TextStyle(fontSize: mFontSize),
                 cursorColor: mCursorColor,
                 onChanged: mOnValueChanged,
                 onSubmitted: mOnSubmit);
        }
    }
 
}

using System.Runtime.CompilerServices;
using System.Xml.Linq;
using System;
using System.Text;
using System.Linq;
using System.Collections;
using System.Collections.Generic;
using Unity.UIWidgets.engine;
using Unity.UIWidgets.painting;
using Unity.UIWidgets.widgets;
using UnityEngine;
using MyTestUIWidgets.UIWidgets;
using Unity.UIWidgets.foundation;
using Unity.UIWidgets.animation;
using Unity.UIWidgets.material;
using Unity.UIWidgets.ui;
using UnityEditor;
using Unity.UIWidgets.Redux;
using Unity.UIWidgets;
 
namespace MyTestUIWidgets
{
    public enum TodoListPageMode
    {
        List,
        Finished
    }
    class Choice
    {
        public Choice(string title, IconData icon)
        {
            this.title = title;
            this.icon = icon;
        }
        public readonly string title;
        public readonly IconData icon;
        public static List<Choice> choices = new List<Choice> {
            new Choice("Car", Unity.UIWidgets.material.Icons.directions_car),
            new Choice("Bicycle", Unity.UIWidgets.material.Icons.directions_bike),
            new Choice("Boat", Unity.UIWidgets.material.Icons.directions_boat),
            new Choice("Bus", Unity.UIWidgets.material.Icons.directions_bus),
            new Choice("Train", Unity.UIWidgets.material.Icons.directions_railway),
            new Choice("Walk", Unity.UIWidgets.material.Icons.directions_walk)
        };
    }
    public class TodoListApp : UIWidgetsPanel
    {
        protected override void OnEnable()
        {
            base.OnEnable();
            FontManager.instance.addFont(Resources.Load<Font>("MaterialIcons-Regular"), "Material Icons", fontWeight: FontWeight.normal);
            FontManager.instance.addFont(Resources.Load<Font>("GalleryIcons"), "GalleryIcons");
 
        }
        protected override Widget createWidget()
        {
            var appWidget = new MaterialApp(home:
                new Scaffold(
                    appBar: new AppBar(title: new Center(child: FQ.Text.Data("My App").SetSize(20).EndText()),
                     backgroundColor: Colors.black,
                     // leading: new Icon(Icons.home),
                     actions: new List<Widget>(){
                        new IconButton(icon:  new Icon(Icons.image,color:Colors.white)),
                        new IconButton(icon:  new Icon(Icons.image,color:Colors.white)),
                        new PopupMenuButton<Choice>(
                            onSelected: (choice)=> { Debug.Log(choice.title); },
                            itemBuilder: (BuildContext subContext) => {
                                List<PopupMenuEntry<Choice>> popupItems = new List<PopupMenuEntry<Choice>>();
                                for (int i = 0; i < Choice.choices.Count; i++) {
                                    popupItems.Add(new PopupMenuItem<Choice>(
                                        value: Choice.choices[i],
                                        child: new Text(Choice.choices[i].title)));
                                }
                                return popupItems;
                            }
                        )
                     }),
                     drawer: new Drawer(
                         child: FQ.ListView.Padding(EdgeInsets.zero).
                         Child(new Divider()).
                         Child(
                             new StoreConnector<TodoViewState, object>(
                                 converter: (state) => null,
                                 builder: (context, Model, disoatcher) =>
                                 {
                                     return new ListTile(leading: new Icon(Icons.list),
                                     title: FQ.Text.Data("代办事项").EndText(), onTap: () =>
                                     {
                                         disoatcher.dispatch(new ListPageModeAction());
                                     });
                                 }
                                )
                             ).
                               Child(new Divider()).
                               Child(
                                        new StoreConnector<TodoViewState, object>(
                                        converter: (state) => null,
                                        builder: (context, Model, disoatcher) =>
                                        {
                                            return new ListTile(
                                        leading: new Icon(Icons.check_box),
                                        title: FQ.Text.Data("已完成事项").EndText(), onTap: () =>
                                        {
                                            disoatcher.dispatch(new FinishedPageModeAction());
                                        });
                                        })).Child(new Divider())
                             .EndListView()
                     ),
                    body: new TodoListPage(),
                    floatingActionButton: new FloatingActionButton(
                        backgroundColor: Colors.redAccent,
                        child: new Icon(Unity.UIWidgets.material.Icons.add_alert),
                        onPressed: () => { Debug.Log("OnbuttonClick"); }
                       )
             ));
            var store = new Store<TodoViewState>(reducer: Reducers.Reduce, initialState: new TodoViewState()
            {
                TodoDatas = Model.Load()
            } ,
              SaveMiddleware.create<TodoViewState>()
             ,ReduxThunk.create<TodoViewState>() 
            );
            var provider = new StoreProvider<TodoViewState>(store: store, child: appWidget);
            return provider;
            //return appWidget;
        }
        class TodoListPage : StatefulWidget
        {
            public override State createState()
            {
                return new TodoListState();
            }
        }
        class TodoListState : State<TodoListPage>
        {
            void OnChange()
            {
                this.setState(() => { });
            }
            private List<Todo> mTodoDatas = null;
            public override Widget build(BuildContext context)
            {
                return new StoreConnector<TodoViewState, TodoViewState>(
                converter: state => state, builder: (buildContext, model, dispatcher) =>
                {
                    if (model.toDoListPageMode == TodoListPageMode.List)
                    {
                        return FQ.ListView
                        .Child(new IconButton(icon: new Icon(Icons.wifi),onPressed:()=>{
                            dispatcher.dispatch(NetworkRequestAction.Create());
                        }) )
                        .Child(new TodoInputView(
                            data =>
                            {
                                dispatcher.dispatch(new AddTodoAction(data));
                                /* AddState(data);  */
                            }))
                        .Child(ListTodoViews(model.TodoDatas, dispatcher))
                        .Padding(EdgeInsets.only(0, 50))
                        .EndListView();
            }
                    else
                    {
                        return FQ.ListView
                        .Child(FinishedListView(model.TodoDatas, dispatcher))
                        .Padding(EdgeInsets.only(0, 50))
                        .EndListView();
        }
    });
            }
private void AddState(string data)
{
    this.setState(() =>
    {
        mTodoDatas.Add(new Todo() { Content = data, Finished = false });
        Save();
    });
}
private void Save()
{
    //  mTodoDatas.Save();
}
Widget[] FinishedListView(List<Todo> Todos, Dispatcher dispatcher)
{
 
    var retWidgets = new List<Widget>();
    foreach (var data in Todos.Where(data => data.Finished))
    {
        retWidgets.Add(new TodoView(data, () =>
        {
            dispatcher.dispatch(new FinishTodoAction(data));
                        Save();
        },
            () =>
            {
                dispatcher.dispatch(new DeleteTodoAction(data));
                        }, Icons.check_box));
        retWidgets.Add(new Divider());
    }
    return retWidgets.ToArray();
}
Widget[] ListTodoViews(List<Todo> Todos, Dispatcher dispatcher)
{
 
    var retWidgets = new List<Widget>();
    foreach (var data in Todos.Where(data => !data.Finished))
    {
        retWidgets.Add(new TodoView(data, () =>
        {
            dispatcher.dispatch(new FinishTodoAction(data));
                        Save();
        },
            () =>
            {
                dispatcher.dispatch(new DeleteTodoAction(data));
 
                        }, Icons.check_box_outline_blank));
        retWidgets.Add(new Divider());
    }
    return retWidgets.ToArray();
}
        }
    }
}