frame_forge 1.0.0
frame_forge: ^1.0.0 copied to clipboard
A DSL Model with UI editor.
Описание #
Для создания xml редактора UI элементов.
Motivation #
Без изменения кода, загрузки в store изменять UI и обмен данными с сервером приложения клиента.
[admin-layout-photo]
Установка #
Добавьте зависимость в ваш pubspec.yaml:
dependencies:
frame_forge: ^1.0.0
Использование #
Создать DSL модель #
- Добавить нужные размеры экранов для LayoutModel.
- Создать контроллер
final LayoutModel layoutModel = LayoutModel(
screenSizes: [ScreenSizeEnum.mobile, ScreenSizeEnum.desktop],
);
late final LayoutModelController _layoutModelController =
LayoutModelController(
layoutModel: layoutModel,
projectSaver: (map) async {
// Здесь можно настроить сохранение проекта
return true;
},
projectLoader: (isSaved) async {
/// Загрузка модели из файла
final FilePickerResult? result = await FilePicker.platform.pickFiles();
if (result == null) return null;
final PlatformFile file = result.files.first;
return utf8.decode(file.bytes! as List<int>);
},
);
Основные компоненты #
Вывод компонентов макета:
Column(
children: [
Items(layoutModel.root, layoutModel),
],
),
Вывод источников-переменных макета:
Column(
children: [
Items(
layoutModel.root.items
.whereType<SourcePage>()
.first, layoutModel,
),
],
),
Вывод стилей макета:
Column(
children: [
Items(
layoutModel.root.items
.whereType<StylePage>()
.first, layoutModel,
),
],
),
Вывод процессов макета:
Column(
children: [
ProcessItems(
layoutModel.root.items
.whereType<ProcessPage>()
.first,layoutModel,
),
],
),
Вывод вьюшки, как страница выглядит Обязательно указать размер экрана из [enum ScreenSizeEnum]
LayoutBuilder(
builder: (context, constraints) {
return Consumer<LayoutModel>(
builder: (context, value, child) {
return ComponentsAndSources(value,constraints, screenSize);
},
);
}
),