mirror of
https://github.com/Iconica-Development/flutter_profile.git
synced 2025-05-18 16:53:45 +02:00
removed column
This commit is contained in:
parent
3dca4489ba
commit
5b2757e19b
8 changed files with 243 additions and 258 deletions
|
@ -25,3 +25,7 @@
|
|||
## 1.0.1
|
||||
|
||||
* Added a default wrap instead of column
|
||||
|
||||
## 1.0.2
|
||||
|
||||
* Added form key and more customizability for web
|
|
@ -35,8 +35,8 @@ class ProfileExample extends StatefulWidget {
|
|||
|
||||
class _ProfileExampleState extends State<ProfileExample> {
|
||||
late User _user;
|
||||
ProfileData profileData =
|
||||
ExampleProfileData().fromMap({'email': 'example@email.com'});
|
||||
ProfileData profileData = ExampleProfileData().fromMap(
|
||||
{'email': 'example@email.com', 'about': 'about', 'remarks': 'remarks'});
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
|
@ -53,23 +53,26 @@ class _ProfileExampleState extends State<ProfileExample> {
|
|||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
//get width and height
|
||||
var width = MediaQuery.of(context).size.width;
|
||||
|
||||
return Scaffold(
|
||||
body: Center(
|
||||
child: Column(
|
||||
children: [
|
||||
SizedBox(
|
||||
height: 400,
|
||||
width: 800,
|
||||
child: ProfilePage(
|
||||
wrapViewOptions:
|
||||
WrapViewOptions(direction: Axis.vertical, spacing: 16),
|
||||
showItems: false,
|
||||
prioritizedItems: const ['remarks', 'about'],
|
||||
wrapViewOptions: WrapViewOptions(
|
||||
direction: Axis.horizontal,
|
||||
spacing: 16,
|
||||
),
|
||||
bottomActionText: 'Log out',
|
||||
itemBuilderOptions: ItemBuilderOptions(
|
||||
inputDecorationField: {
|
||||
'first_name': const InputDecoration(
|
||||
constraints: BoxConstraints(maxHeight: 70, maxWidth: 200),
|
||||
label: Text('First name'),
|
||||
),
|
||||
'last_name': const InputDecoration(
|
||||
constraints: BoxConstraints(maxHeight: 70, maxWidth: 150),
|
||||
label: Text('First name'),
|
||||
),
|
||||
},
|
||||
//no label for email
|
||||
validators: {
|
||||
'first_name': (String? value) {
|
||||
if (value == null || value.isEmpty) {
|
||||
|
@ -98,12 +101,16 @@ class _ProfileExampleState extends State<ProfileExample> {
|
|||
pagePadding: EdgeInsets.only(
|
||||
top: 50,
|
||||
bottom: 50,
|
||||
left: MediaQuery.of(context).size.width * 0.1,
|
||||
right: MediaQuery.of(context).size.width * 0.1,
|
||||
left: width * 0.1,
|
||||
right: width * 0.1,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
const Text('test')
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -127,7 +134,7 @@ class CustomItemBuilderExample extends ItemBuilder {
|
|||
options.inputDecorationField?[key] ?? options.inputDecoration;
|
||||
var formFieldKey = GlobalKey<FormFieldState>();
|
||||
return SizedBox(
|
||||
width: 300,
|
||||
width: 400,
|
||||
child: TextFormField(
|
||||
keyboardType: options.keyboardType?[key],
|
||||
key: formFieldKey,
|
||||
|
|
|
@ -8,9 +8,13 @@ import 'package:flutter_profile/flutter_profile.dart';
|
|||
class ExampleProfileData extends ProfileData {
|
||||
ExampleProfileData({
|
||||
this.email,
|
||||
this.about,
|
||||
this.remarks,
|
||||
});
|
||||
|
||||
String? email;
|
||||
String? about;
|
||||
String? remarks;
|
||||
|
||||
@override
|
||||
Map<String, dynamic> mapWidget(
|
||||
|
@ -19,6 +23,8 @@ class ExampleProfileData extends ProfileData {
|
|||
) {
|
||||
return {
|
||||
'email': null,
|
||||
'about': null,
|
||||
'remarks': null,
|
||||
};
|
||||
}
|
||||
|
||||
|
@ -26,14 +32,14 @@ class ExampleProfileData extends ProfileData {
|
|||
ProfileData fromMap(Map<String, dynamic> data) {
|
||||
return ExampleProfileData(
|
||||
email: data['email'],
|
||||
about: data['about'],
|
||||
remarks: data['remarks'],
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
Map<String, dynamic> toMap() {
|
||||
return {
|
||||
'email': email,
|
||||
};
|
||||
return {'email': email, 'about': about, 'remarks': remarks};
|
||||
}
|
||||
|
||||
@override
|
||||
|
|
|
@ -124,7 +124,7 @@ packages:
|
|||
path: ".."
|
||||
relative: true
|
||||
source: path
|
||||
version: "1.0.1"
|
||||
version: "1.0.2"
|
||||
flutter_test:
|
||||
dependency: "direct dev"
|
||||
description: flutter
|
||||
|
|
|
@ -6,81 +6,57 @@ import 'package:flutter/material.dart';
|
|||
import 'package:flutter_profile/src/widgets/item_builder/item_builder.dart';
|
||||
import 'package:flutter_profile/src/widgets/item_builder/item_builder_options.dart';
|
||||
|
||||
class ItemList extends StatefulWidget {
|
||||
const ItemList(
|
||||
class ItemList {
|
||||
ItemList(
|
||||
this.items,
|
||||
this.typeMap,
|
||||
this.spacing,
|
||||
this.updateProfile,
|
||||
this.saveProfile, {
|
||||
required this.formKey,
|
||||
this.itemBuilder,
|
||||
this.itemBuilderOptions,
|
||||
super.key,
|
||||
}) {
|
||||
for (var item in items.entries) {
|
||||
widgets.addAll({
|
||||
item.key: itemBuilder == null
|
||||
? builder.build(
|
||||
item.key,
|
||||
item.value,
|
||||
typeMap[item.key],
|
||||
(value) {
|
||||
saveProfile();
|
||||
},
|
||||
(value) {
|
||||
updateProfile(item.key, value);
|
||||
},
|
||||
)
|
||||
: itemBuilder!.build(
|
||||
item.key,
|
||||
item.value,
|
||||
typeMap[item.key],
|
||||
(value) {
|
||||
saveProfile();
|
||||
},
|
||||
(value) {
|
||||
updateProfile(item.key, value);
|
||||
},
|
||||
)
|
||||
});
|
||||
}
|
||||
}
|
||||
Map<String, Widget> getItemList() => widgets;
|
||||
|
||||
final Map<String, dynamic> items;
|
||||
final Map<String, dynamic> typeMap;
|
||||
final double spacing;
|
||||
final Function(String, String?) updateProfile;
|
||||
final Function() saveProfile;
|
||||
final ItemBuilder? itemBuilder;
|
||||
final ItemBuilderOptions? itemBuilderOptions;
|
||||
final GlobalKey<FormState> formKey;
|
||||
|
||||
@override
|
||||
State<ItemList> createState() => _ItemListState();
|
||||
}
|
||||
|
||||
class _ItemListState extends State<ItemList> {
|
||||
var widgets = <Widget>[];
|
||||
Map<String, Widget> widgets = {};
|
||||
|
||||
late ItemBuilder builder = ItemBuilder(
|
||||
options: widget.itemBuilderOptions ?? ItemBuilderOptions(),
|
||||
options: itemBuilderOptions ?? ItemBuilderOptions(),
|
||||
);
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
|
||||
for (var item in widget.items.entries) {
|
||||
widget.itemBuilder == null
|
||||
? widgets.add(
|
||||
builder.build(
|
||||
item.key,
|
||||
item.value,
|
||||
widget.typeMap[item.key],
|
||||
(value) {
|
||||
widget.saveProfile();
|
||||
},
|
||||
(value) {
|
||||
widget.updateProfile(item.key, value);
|
||||
},
|
||||
),
|
||||
)
|
||||
: widgets.add(
|
||||
widget.itemBuilder!.build(
|
||||
item.key,
|
||||
item.value,
|
||||
widget.typeMap[item.key],
|
||||
(value) {
|
||||
widget.saveProfile();
|
||||
},
|
||||
(value) {
|
||||
widget.updateProfile(item.key, value);
|
||||
},
|
||||
),
|
||||
);
|
||||
widgets.add(SizedBox(
|
||||
height: widget.spacing,
|
||||
));
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Column(
|
||||
children: widgets,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -35,6 +35,7 @@ class ProfilePage extends StatefulWidget {
|
|||
this.style = const ProfileStyle(),
|
||||
this.customAvatar,
|
||||
this.showAvatar = true,
|
||||
this.showItems = true,
|
||||
this.itemBuilder,
|
||||
this.itemBuilderOptions,
|
||||
this.bottomActionText,
|
||||
|
@ -42,6 +43,8 @@ class ProfilePage extends StatefulWidget {
|
|||
this.showDefaultItems = true,
|
||||
this.wrapItemsBuilder,
|
||||
this.wrapViewOptions,
|
||||
this.extraWidgets,
|
||||
this.formKey,
|
||||
}) : super(key: key);
|
||||
|
||||
/// User containing all the user data.
|
||||
|
@ -59,6 +62,9 @@ class ProfilePage extends StatefulWidget {
|
|||
/// Whether to show the users avatar.
|
||||
final bool showAvatar;
|
||||
|
||||
/// Whether you want to show the input fields, sometimes you just want to edit the avatar.
|
||||
final bool showItems;
|
||||
|
||||
/// Sets the text for the [InkWell] at the bottom of the profile page. The [InkWell] is disabled when null.
|
||||
final String? bottomActionText;
|
||||
|
||||
|
@ -80,6 +86,12 @@ class ProfilePage extends StatefulWidget {
|
|||
/// Edit the direction and spacing between every item
|
||||
final WrapViewOptions? wrapViewOptions;
|
||||
|
||||
/// The map of extra widgets that might want to be added like empty SizedBoxes for styling.
|
||||
final Map<String, Widget>? extraWidgets;
|
||||
|
||||
/// Use the form key to save on any custom callback
|
||||
final GlobalKey<FormState>? formKey;
|
||||
|
||||
@override
|
||||
State<ProfilePage> createState() => _ProfilePageState();
|
||||
}
|
||||
|
@ -96,6 +108,7 @@ class _ProfilePageState extends State<ProfilePage> {
|
|||
style: widget.style,
|
||||
customAvatar: widget.customAvatar,
|
||||
showAvatar: widget.showAvatar,
|
||||
showItems: widget.showItems,
|
||||
bottomActionText: widget.bottomActionText,
|
||||
itemBuilder: widget.itemBuilder,
|
||||
itemBuilderOptions: widget.itemBuilderOptions,
|
||||
|
@ -103,15 +116,22 @@ class _ProfilePageState extends State<ProfilePage> {
|
|||
showDefaultItems: widget.showDefaultItems,
|
||||
wrapItemsBuilder: widget.wrapItemsBuilder,
|
||||
wrapViewOptions: widget.wrapViewOptions,
|
||||
extraWidgets: widget.extraWidgets,
|
||||
formKey: widget.formKey,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class WrapViewOptions {
|
||||
WrapViewOptions(
|
||||
{this.direction, this.spacing, this.runSpacing, this.clipBehavior});
|
||||
{this.direction,
|
||||
this.spacing,
|
||||
this.wrapAlignment,
|
||||
this.runSpacing,
|
||||
this.clipBehavior});
|
||||
Axis? direction;
|
||||
double? spacing;
|
||||
double? runSpacing;
|
||||
Clip? clipBehavior;
|
||||
WrapAlignment? wrapAlignment;
|
||||
}
|
||||
|
|
|
@ -26,7 +26,10 @@ class ProfileWrapper extends StatefulWidget {
|
|||
this.bottomActionText,
|
||||
this.prioritizedItems = const [],
|
||||
this.showDefaultItems = true,
|
||||
this.showItems = true,
|
||||
this.wrapItemsBuilder,
|
||||
this.formKey,
|
||||
this.extraWidgets,
|
||||
super.key,
|
||||
});
|
||||
|
||||
|
@ -41,7 +44,10 @@ class ProfileWrapper extends StatefulWidget {
|
|||
final Function rebuild;
|
||||
final ItemBuilderOptions? itemBuilderOptions;
|
||||
final bool showDefaultItems;
|
||||
final bool showItems;
|
||||
final Widget Function(BuildContext context, Widget child)? wrapItemsBuilder;
|
||||
final Map<String, Widget>? extraWidgets;
|
||||
final GlobalKey<FormState>? formKey;
|
||||
|
||||
/// Map keys of items that should be shown first before the default items and the rest of the items.
|
||||
final List<String> prioritizedItems;
|
||||
|
@ -51,21 +57,25 @@ class ProfileWrapper extends StatefulWidget {
|
|||
}
|
||||
|
||||
class _ProfileWrapperState extends State<ProfileWrapper> {
|
||||
List<Widget> defaultItems = [];
|
||||
GlobalKey<FormState> formKey = GlobalKey<FormState>();
|
||||
late Map<String, Widget> widgets = {};
|
||||
Map<String, Widget> defaultItems = {};
|
||||
late GlobalKey<FormState> _formKey;
|
||||
Map<String, dynamic> formValues = {};
|
||||
bool _isUploadingImage = false;
|
||||
late final Widget child;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
_formKey = widget.formKey ?? GlobalKey<FormState>();
|
||||
|
||||
super.initState();
|
||||
if (widget.showDefaultItems) {
|
||||
if (widget.itemBuilder == null) {
|
||||
ItemBuilder builder = ItemBuilder(
|
||||
options: widget.itemBuilderOptions ?? ItemBuilderOptions(),
|
||||
);
|
||||
defaultItems.add(
|
||||
builder.build(
|
||||
defaultItems.addAll({
|
||||
'first_name': builder.build(
|
||||
'first_name',
|
||||
widget.user.firstName,
|
||||
null,
|
||||
|
@ -79,14 +89,7 @@ class _ProfileWrapperState extends State<ProfileWrapper> {
|
|||
}
|
||||
},
|
||||
),
|
||||
);
|
||||
defaultItems.add(
|
||||
SizedBox(
|
||||
height: widget.style.betweenDefaultItemPadding,
|
||||
),
|
||||
);
|
||||
defaultItems.add(
|
||||
builder.build(
|
||||
'last_name': builder.build(
|
||||
'last_name',
|
||||
widget.user.lastName,
|
||||
null,
|
||||
|
@ -100,15 +103,10 @@ class _ProfileWrapperState extends State<ProfileWrapper> {
|
|||
}
|
||||
},
|
||||
),
|
||||
);
|
||||
defaultItems.add(
|
||||
SizedBox(
|
||||
height: widget.style.betweenDefaultItemPadding,
|
||||
),
|
||||
);
|
||||
});
|
||||
} else {
|
||||
defaultItems.add(
|
||||
widget.itemBuilder!.build(
|
||||
defaultItems.addAll({
|
||||
'first_name': widget.itemBuilder!.build(
|
||||
'first_name',
|
||||
widget.user.firstName,
|
||||
null,
|
||||
|
@ -122,14 +120,7 @@ class _ProfileWrapperState extends State<ProfileWrapper> {
|
|||
}
|
||||
},
|
||||
),
|
||||
);
|
||||
defaultItems.add(
|
||||
SizedBox(
|
||||
height: widget.style.betweenDefaultItemPadding,
|
||||
),
|
||||
);
|
||||
defaultItems.add(
|
||||
widget.itemBuilder!.build(
|
||||
'last_name': widget.itemBuilder!.build(
|
||||
'last_name',
|
||||
widget.user.lastName,
|
||||
null,
|
||||
|
@ -143,69 +134,51 @@ class _ProfileWrapperState extends State<ProfileWrapper> {
|
|||
}
|
||||
},
|
||||
),
|
||||
);
|
||||
defaultItems.add(
|
||||
SizedBox(
|
||||
height: widget.style.betweenDefaultItemPadding,
|
||||
),
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
widgets.addAll(widget.extraWidgets ?? {});
|
||||
widgets.addAll(defaultItems);
|
||||
widgets.addAll(ItemList(
|
||||
Map.fromEntries(widget.user.profileData!.toMap().entries),
|
||||
widget.user.profileData!.mapWidget(
|
||||
() {
|
||||
widget.rebuild();
|
||||
},
|
||||
context,
|
||||
),
|
||||
(key, value) {
|
||||
if (widget.user.toMap()['profile_data'][key] == null) {
|
||||
widget.service.editProfile(widget.user, key, value);
|
||||
} else if (widget.user.toMap()['profile_data'][key] != value) {
|
||||
widget.service.editProfile(widget.user, key, value);
|
||||
}
|
||||
},
|
||||
() {
|
||||
submitAllChangedFields();
|
||||
},
|
||||
itemBuilder: widget.itemBuilder,
|
||||
itemBuilderOptions: widget.itemBuilderOptions,
|
||||
formKey: _formKey,
|
||||
).getItemList());
|
||||
|
||||
var items = Wrap(
|
||||
alignment: widget.wrapViewOptions?.wrapAlignment ?? WrapAlignment.start,
|
||||
direction: widget.wrapViewOptions?.direction ?? Axis.vertical,
|
||||
spacing: widget.wrapViewOptions?.spacing ?? 0,
|
||||
runSpacing: widget.wrapViewOptions?.runSpacing ?? 0,
|
||||
clipBehavior: widget.wrapViewOptions?.clipBehavior ?? Clip.none,
|
||||
children: [
|
||||
ItemList(
|
||||
Map.fromEntries(widget.user.profileData!.toMap().entries.where(
|
||||
(element) => widget.prioritizedItems.contains(element.key))),
|
||||
widget.user.profileData!.mapWidget(
|
||||
() {
|
||||
widget.rebuild();
|
||||
},
|
||||
context,
|
||||
),
|
||||
widget.style.betweenDefaultItemPadding,
|
||||
(key, value) {
|
||||
if (widget.user.toMap()['profile_data'][key] == null) {
|
||||
widget.service.editProfile(widget.user, key, value);
|
||||
} else if (widget.user.toMap()['profile_data'][key] != value) {
|
||||
widget.service.editProfile(widget.user, key, value);
|
||||
}
|
||||
},
|
||||
() {
|
||||
submitAllChangedFields();
|
||||
},
|
||||
itemBuilder: widget.itemBuilder,
|
||||
itemBuilderOptions: widget.itemBuilderOptions,
|
||||
formKey: formKey,
|
||||
),
|
||||
if (widget.showDefaultItems) ...defaultItems,
|
||||
// remove all the items that have priority from the widget.user.profileData!.toMap()
|
||||
ItemList(
|
||||
Map.fromEntries(widget.user.profileData!.toMap().entries.where(
|
||||
(element) => !widget.prioritizedItems.contains(element.key))),
|
||||
widget.user.profileData!.mapWidget(
|
||||
() {
|
||||
widget.rebuild();
|
||||
},
|
||||
context,
|
||||
),
|
||||
widget.style.betweenDefaultItemPadding,
|
||||
(key, value) {
|
||||
if (widget.user.toMap()['profile_data'][key] == null) {
|
||||
widget.service.editProfile(widget.user, key, value);
|
||||
} else if (widget.user.toMap()['profile_data'][key] != value) {
|
||||
widget.service.editProfile(widget.user, key, value);
|
||||
}
|
||||
},
|
||||
() {
|
||||
submitAllChangedFields();
|
||||
},
|
||||
itemBuilder: widget.itemBuilder,
|
||||
itemBuilderOptions: widget.itemBuilderOptions,
|
||||
formKey: formKey,
|
||||
),
|
||||
//add all items with prio then those without
|
||||
for (var key in widget.prioritizedItems)
|
||||
// get values from widgets with this key
|
||||
...widgets.entries
|
||||
.where((element) => element.key == key)
|
||||
.map((e) => e.value),
|
||||
|
||||
...widgets.entries
|
||||
.where((element) => !widget.prioritizedItems.contains(element.key))
|
||||
.map((e) => e.value),
|
||||
],
|
||||
);
|
||||
|
||||
|
@ -250,8 +223,7 @@ class _ProfileWrapperState extends State<ProfileWrapper> {
|
|||
height: widget.style.betweenDefaultItemPadding,
|
||||
),
|
||||
],
|
||||
// all the items that have priority above the default items
|
||||
Form(key: formKey, child: child),
|
||||
if (widget.showItems) Form(key: _formKey, child: child),
|
||||
if (widget.bottomActionText != null) ...[
|
||||
SizedBox(
|
||||
height: widget.style.betweenDefaultItemPadding,
|
||||
|
@ -280,8 +252,8 @@ class _ProfileWrapperState extends State<ProfileWrapper> {
|
|||
|
||||
/// This calls onSaved on all the fiels which check if they have a new value
|
||||
void submitAllChangedFields() {
|
||||
if (formKey.currentState!.validate()) {
|
||||
formKey.currentState!.save();
|
||||
if (_formKey.currentState!.validate()) {
|
||||
_formKey.currentState!.save();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
name: flutter_profile
|
||||
description: Flutter profile package
|
||||
version: 1.0.1
|
||||
version: 1.0.2
|
||||
repository: https://github.com/Iconica-Development/flutter_profile
|
||||
|
||||
environment:
|
||||
|
|
Loading…
Reference in a new issue