Line data Source code
1 : import 'package:flutter/material.dart';
2 : import 'package:mvvm_builder/mvvm_builder.dart';
3 : import 'package:pal/src/database/entity/graphic_entity.dart';
4 : import 'package:pal/src/injectors/editor_app/editor_app_injector.dart';
5 : import 'package:pal/src/theme.dart';
6 : import 'package:pal/src/ui/editor/pages/media_gallery/media_gallery_loader.dart';
7 : import 'package:pal/src/ui/editor/pages/media_gallery/widgets/media_cell_widget.dart';
8 :
9 : import 'media_gallery_presenter.dart';
10 : import 'media_gallery_viewmodel.dart';
11 :
12 : class MediaGalleryPageArguments {
13 : final String mediaId;
14 :
15 0 : MediaGalleryPageArguments(
16 : this.mediaId,
17 : );
18 : }
19 :
20 : abstract class MediaGalleryView {
21 : void popBackToEditor(final GraphicEntity media);
22 : }
23 :
24 : class MediaGalleryPage extends StatelessWidget implements MediaGalleryView {
25 : final String mediaId;
26 : final MediaGalleryLoader loader;
27 :
28 1 : MediaGalleryPage({
29 : Key key,
30 : this.mediaId,
31 : this.loader,
32 : });
33 :
34 : final _mvvmPageBuilder =
35 : MVVMPageBuilder<MediaGalleryPresenter, MediaGalleryModel>();
36 : final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey();
37 : final ScrollController _gridListController = ScrollController();
38 :
39 1 : @override
40 : Widget build(BuildContext context) {
41 2 : return _mvvmPageBuilder.build(
42 1 : key: UniqueKey(),
43 : context: context,
44 2 : presenterBuilder: (context) => MediaGalleryPresenter(
45 : this,
46 1 : loader: this.loader ??
47 0 : MediaGalleryLoader(
48 0 : EditorInjector.of(context).projectGalleryRepository,
49 : ),
50 1 : mediaId: mediaId,
51 : ),
52 1 : builder: (context, presenter, model) {
53 1 : return WillPopScope(
54 0 : onWillPop: (){
55 0 : this.popBackToEditor(model.selectedMedia);
56 0 : return Future.value(false);
57 : },
58 1 : child: Scaffold(
59 1 : key: _scaffoldKey,
60 1 : appBar: AppBar(
61 1 : title: Text(
62 : 'My image gallery',
63 1 : style: TextStyle(
64 4 : color: PalTheme.of(context.buildContext).colors.dark,
65 : ),
66 : ),
67 1 : iconTheme: IconThemeData(
68 4 : color: PalTheme.of(context.buildContext).colors.dark,
69 : ),
70 4 : backgroundColor: PalTheme.of(context.buildContext).colors.light,
71 : ),
72 2 : body: this._buildPage(context.buildContext, presenter, model),
73 : ),
74 : );
75 : },
76 : );
77 : }
78 :
79 1 : Widget _buildPage(
80 : final BuildContext context,
81 : final MediaGalleryPresenter presenter,
82 : final MediaGalleryModel model,
83 : ) {
84 1 : return Column(
85 1 : children: [
86 1 : Container(
87 1 : key: ValueKey('pal_MediaGalleryPage_Header'),
88 3 : color: PalTheme.of(context).colors.color1,
89 1 : child: Padding(
90 : padding: const EdgeInsets.all(16.0),
91 1 : child: Text(
92 : 'You can upload new image to your app gallery using web Pal admin.',
93 1 : key: ValueKey('pal_MediaGalleryPage_Header_NoteText'),
94 1 : style: TextStyle(
95 : color: Colors.white,
96 : ),
97 : ),
98 : ),
99 : ),
100 1 : Expanded(
101 1 : child: (model.isLoading)
102 2 : ? Center(child: CircularProgressIndicator())
103 1 : : GridView.builder(
104 1 : key: ValueKey('pal_MediaGalleryPage_Body_Grid'),
105 1 : controller: this._gridListController
106 1 : ..addListener(() {
107 0 : if (this._gridListController.position.extentAfter <=
108 : 100) {
109 0 : presenter.loadMore();
110 : }
111 : }),
112 1 : physics: AlwaysScrollableScrollPhysics(),
113 1 : gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
114 : crossAxisCount: 4,
115 : mainAxisSpacing: 2.0,
116 : crossAxisSpacing: 2.0,
117 : ),
118 : padding: const EdgeInsets.all(2.0),
119 1 : itemBuilder: (context, index) {
120 2 : GraphicEntity media = model.medias[index];
121 1 : return MediaCellWidget(
122 : // FIXME: Int or String ??
123 2 : id: media.id.toString(),
124 1 : url: media.url,
125 4 : isSelected: model.selectedMedia?.id == media.id,
126 0 : onTap: () => presenter.selectMedia(media),
127 : );
128 : },
129 2 : itemCount: model.medias.length,
130 : ),
131 : ),
132 1 : Padding(
133 : padding: const EdgeInsets.only(
134 : top: 8.0,
135 : bottom: 12.0,
136 : left: 16.0,
137 : right: 16.0,
138 : ),
139 1 : child: Container(
140 : width: double.infinity,
141 1 : child: _buildSelectButton(context, presenter, model),
142 : ),
143 : ),
144 : ],
145 : );
146 : }
147 :
148 1 : Widget _buildSelectButton(
149 : final BuildContext context,
150 : final MediaGalleryPresenter presenter,
151 : final MediaGalleryModel model,
152 : ) {
153 1 : return SizedBox(
154 : width: double.infinity,
155 1 : child: RaisedButton(
156 1 : key: ValueKey('pal_MediaGalleryPage_SelectButton'),
157 3 : disabledColor: PalTheme.of(context).colors.color4,
158 1 : child: Text(
159 : 'Select',
160 1 : style: TextStyle(
161 : color: Colors.white,
162 : ),
163 : ),
164 3 : color: PalTheme.of(context).colors.color1,
165 0 : onPressed: () => this.popBackToEditor(model.selectedMedia),
166 1 : shape: RoundedRectangleBorder(
167 1 : borderRadius: BorderRadius.circular(8.0),
168 : ),
169 : ),
170 : );
171 : }
172 :
173 0 : @override
174 : void popBackToEditor(final GraphicEntity media) {
175 0 : Navigator.pop(this._scaffoldKey.currentContext, media);
176 : }
177 : }
|