начало
Несколько дней назад большой мужчина проверил меня и сказал:
flutter页面开发需要写StatefulWidget和State,Android只需要Activity,
如何简化这种开发方式?
Я ответил:
activity还需要写xml呢~
В тишине босса со всех сторон раздались теплые аплодисменты...
......
Поздней ночью под эстакадой я ворочался, не мог уснуть...
'Неужели это действительно возможно? '...
После неоднократных осмотров и полировки это «колесо» действительно немного круглое, и оно довольно гладко «катится».
天桥之下难免简陋,如有不足还请海涵,万望指点~ 嘿嘿
идея
Обычно мы разрабатываем страницу A со следующей структурой:
class A extends StatefulWidget{
}
class AState extends State<A>{
}
В то же время, чтобы разделить и унифицировать маршрутизацию, мы используем метод перехода на страницу (т.е. статическую маршрутизацию):
Navigator.of(context).pushName('/a')
Недостатком этого метода перехода является то, что значение страницы должно быть в виде карты, что неудобно и легко ввести неправильный ключ, даже если вы используете аннотации, это все равно неизбежно.
Повторное наблюдение и размышление привели к следующей структурной схеме.
Структурная схема
Краткое введение в каждый модуль
BaseState
abstract class BaseState<T extends StatefulWidget> extends State<T>{}
Страница и просмотр пакета универсального функционала
WidgetState
abstract class WidgetState extends BaseState with WidgetGenerator{}
Общая инкапсуляция функций для пользовательского представления
PageState
abstract class PageState extends BaseState with WidgetGenerator,RouteAware{}
Общая инкапсуляция функций для пользовательской страницы
RouteAware对路由观测,你可以埋点或者记录等等
WidgetGenerator
mixin WidgetGenerator on BaseState implements _RouteGenerator,_NavigateActor{}
Создание виджетов и сборка функций для виджетов
_RouteGenerator 生成Route(可带过渡动画)功能
PageRoute<T> buildRoute<T>(Widget page, String routeName, {PageAnimation animation, Object args}) {
....
}
_NavigateActor 路由的各种push和pop操作,你也可以拓展
Future push<T extends PageState>(T page,{PageAnimation animation});
Future pushAndRemoveUntil<T extends PageState>(T page,{PageAnimation animation,RoutePredicate predicate});
Future pushReplacement<T extends Object,TO extends PageState>(TO page, {PageAnimation animation, T result });
void pop<T extends Object>({T result,});
void popUntil({RoutePredicate predicate});
bool canPop();
Введение каждого модуля завершено, далее описывается, как его использовать.
как использовать
разработка страницы
Когда нам нужно разработать страницу А, следующим образом:
clas A extends PageState{
Widget build(BuildContext context){...}
}
Это так просто.
стоимость страницы
Когда мы хотим передать значение на страницу B/вернуть значение на страницу A, следующим образом:
clas B extends PageState{
final var value;
B(this.value);
Widget build(BuildContext context){...}
}
A跳到B
A页面内:push(B('你的值'))
.then((value)=>'B返回值=$value');
B退到A
B页面内:pop(result:'返回给A的值');
Использование pushAndRemoveUntil
Если я хочу удалить B и C, когда я перехожу от A к B к C, а затем от C к D, операция выглядит следующим образом:
在C页面
push(D(),predicate: (route)=>route.settings.name == '$A')
D页面
当你pop()后,你会发现到了A页面
частичное обновление
Вы можете обновить с любой степенью детализации без каких-либо инструментов.Операция выглядит следующим образом.
假设widget a, 我们调用
a.refreshState() 即可对a进行刷新
但并不意味着,就可以抛弃Provider,redux等库
Поскольку состояние открыто для внешнего мира, вы также можете делать более эффектные операции~~~
создать виджет
Мне не нужно прыгать, но мне нужно сгенерировать виджеты со своей страницы/представления.Операция выглядит следующим образом:
你的页面/View.generateWidget({Key key}) 就可以生成一个widget了
如果需要key,还可以加上一个
наконец
Я заменил демо в фреймворке существующим методом разработки, добавил новое целевое демо и провел повторные тесты.В целом, эффективность разработки значительно повысилась, и удалось избежать проблем с ошибками ключевого значения.Кроме того, нет совместимости при замене возникли проблемы
Однако это пока первое издание.
Вы можете использовать его в следующей структуре, чтобы увидеть, есть ли какие-либо недостатки или ошибки, и сообщить мне.Большое спасибо.