first commit
This commit is contained in:
13
lib/easy_settings_screen.dart
Normal file
13
lib/easy_settings_screen.dart
Normal file
@@ -0,0 +1,13 @@
|
||||
/*
|
||||
* QR.Flutter
|
||||
* Copyright (c) 2021 the QR.Flutter authors.
|
||||
* See LICENSE for distribution and usage details.
|
||||
*/
|
||||
|
||||
export 'src/settings_screen_utils.dart';
|
||||
export 'src/icon_style.dart';
|
||||
export 'src/easy_component_settings_item.dart';
|
||||
export 'src/easy_component_settings_group.dart';
|
||||
export 'src/easy_component_big_user_card.dart';
|
||||
export 'src/easy_component_small_user_card.dart';
|
||||
export 'src/easy_component_simple_user_card.dart';
|
107
lib/src/easy_component_big_user_card.dart
Normal file
107
lib/src/easy_component_big_user_card.dart
Normal file
@@ -0,0 +1,107 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class BigUserCard extends StatelessWidget {
|
||||
final Color? backgroundColor;
|
||||
final Color? settingColor;
|
||||
final double? cardRadius;
|
||||
final Color? backgroundMotifColor;
|
||||
final Widget? cardActionWidget;
|
||||
final String? userName;
|
||||
final Widget? userMoreInfo;
|
||||
final ImageProvider userProfilePic;
|
||||
|
||||
const BigUserCard({
|
||||
super.key,
|
||||
this.backgroundColor,
|
||||
this.settingColor,
|
||||
this.cardRadius = 30,
|
||||
required this.userName,
|
||||
this.backgroundMotifColor = Colors.white,
|
||||
this.cardActionWidget,
|
||||
this.userMoreInfo,
|
||||
required this.userProfilePic,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
var mediaQueryHeight = MediaQuery.of(context).size.height;
|
||||
return Container(
|
||||
height: mediaQueryHeight / 4,
|
||||
margin: EdgeInsets.only(bottom: 20),
|
||||
decoration: BoxDecoration(
|
||||
color: backgroundColor ?? Theme.of(context).cardColor,
|
||||
borderRadius: BorderRadius.circular(
|
||||
double.parse(cardRadius!.toString()),
|
||||
),
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
Align(
|
||||
alignment: Alignment.bottomLeft,
|
||||
child: CircleAvatar(
|
||||
radius: 100,
|
||||
backgroundColor: backgroundMotifColor!.withValues(alpha: .1),
|
||||
),
|
||||
),
|
||||
Align(
|
||||
alignment: Alignment.center,
|
||||
child: CircleAvatar(
|
||||
radius: 400,
|
||||
backgroundColor: backgroundMotifColor!.withValues(alpha: .05),
|
||||
),
|
||||
),
|
||||
Container(
|
||||
margin: EdgeInsets.all(10),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: (cardActionWidget != null)
|
||||
? MainAxisAlignment.spaceEvenly
|
||||
: MainAxisAlignment.center,
|
||||
children: [
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||||
children: [
|
||||
// User profile
|
||||
Expanded(
|
||||
child: CircleAvatar(
|
||||
radius: mediaQueryHeight / 18,
|
||||
backgroundImage: userProfilePic,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
userName!,
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: mediaQueryHeight / 30,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
if (userMoreInfo != null) ...[userMoreInfo!],
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(50),
|
||||
color: settingColor ?? Theme.of(context).cardColor,
|
||||
),
|
||||
child: (cardActionWidget != null)
|
||||
? cardActionWidget
|
||||
: Container(),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
72
lib/src/easy_component_settings_group.dart
Normal file
72
lib/src/easy_component_settings_group.dart
Normal file
@@ -0,0 +1,72 @@
|
||||
import 'package:easy_settings_screen/src/easy_component_settings_item.dart';
|
||||
import 'package:easy_settings_screen/src/settings_screen_utils.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// This component group the Settings items (BabsComponentSettingsItem)
|
||||
/// All one BabsComponentSettingsGroup have a title and the developper can improve the design.
|
||||
class SettingsGroup extends StatelessWidget {
|
||||
final String? settingsGroupTitle;
|
||||
final TextStyle? settingsGroupTitleStyle;
|
||||
final List<SettingsItem> items;
|
||||
final EdgeInsets? margin;
|
||||
final Color? backgroundColor;
|
||||
// Icons size
|
||||
final double? iconItemSize;
|
||||
|
||||
const SettingsGroup({
|
||||
super.key,
|
||||
this.settingsGroupTitle,
|
||||
this.settingsGroupTitleStyle,
|
||||
required this.items,
|
||||
this.backgroundColor,
|
||||
this.margin,
|
||||
this.iconItemSize = 25,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
if (iconItemSize != null) {
|
||||
SettingsScreenUtils.settingsGroupIconSize = iconItemSize;
|
||||
}
|
||||
|
||||
return Container(
|
||||
margin: margin ?? EdgeInsets.only(bottom: 20),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// The title
|
||||
(settingsGroupTitle != null)
|
||||
? Padding(
|
||||
padding: const EdgeInsets.only(bottom: 5),
|
||||
child: Text(
|
||||
settingsGroupTitle!,
|
||||
style: (settingsGroupTitleStyle == null)
|
||||
? TextStyle(fontSize: 25, fontWeight: FontWeight.bold)
|
||||
: settingsGroupTitleStyle,
|
||||
),
|
||||
)
|
||||
: Container(),
|
||||
// The SettingsGroup sections
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: backgroundColor ?? Theme.of(context).cardColor,
|
||||
borderRadius: BorderRadius.circular(15),
|
||||
),
|
||||
child: ListView.separated(
|
||||
separatorBuilder: (context, index) {
|
||||
return Divider();
|
||||
},
|
||||
itemCount: items.length,
|
||||
itemBuilder: (BuildContext context, int index) {
|
||||
return items[index];
|
||||
},
|
||||
shrinkWrap: true,
|
||||
padding: EdgeInsets.zero,
|
||||
physics: ScrollPhysics(),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
78
lib/src/easy_component_settings_item.dart
Normal file
78
lib/src/easy_component_settings_item.dart
Normal file
@@ -0,0 +1,78 @@
|
||||
import 'package:easy_settings_screen/src/icon_style.dart';
|
||||
import 'package:easy_settings_screen/src/settings_screen_utils.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class SettingsItem extends StatelessWidget {
|
||||
final IconData icons;
|
||||
final IconStyle? iconStyle;
|
||||
final String title;
|
||||
final TextStyle? titleStyle;
|
||||
final String? subtitle;
|
||||
final TextStyle? subtitleStyle;
|
||||
final Widget? trailing;
|
||||
final VoidCallback? onTap;
|
||||
final int? titleMaxLine;
|
||||
final int? subtitleMaxLine;
|
||||
final TextOverflow? overflow;
|
||||
|
||||
const SettingsItem({super.key,
|
||||
required this.icons,
|
||||
this.iconStyle,
|
||||
required this.title,
|
||||
this.titleStyle,
|
||||
this.subtitle,
|
||||
this.subtitleStyle,
|
||||
this.trailing,
|
||||
this.onTap,
|
||||
this.titleMaxLine,
|
||||
this.subtitleMaxLine,
|
||||
this.overflow = TextOverflow.ellipsis,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return ClipRRect(
|
||||
borderRadius: BorderRadius.circular(15),
|
||||
child: ListTile(
|
||||
onTap: onTap,
|
||||
leading: (iconStyle != null && iconStyle!.withBackground!)
|
||||
? Container(
|
||||
decoration: BoxDecoration(
|
||||
color: iconStyle!.backgroundColor,
|
||||
borderRadius: BorderRadius.circular(iconStyle!.borderRadius!),
|
||||
),
|
||||
padding: EdgeInsets.all(5),
|
||||
child: Icon(
|
||||
icons,
|
||||
size: SettingsScreenUtils.settingsGroupIconSize,
|
||||
color: iconStyle!.iconsColor,
|
||||
),
|
||||
)
|
||||
: Padding(
|
||||
padding: EdgeInsets.all(5),
|
||||
child: Icon(
|
||||
icons,
|
||||
size: SettingsScreenUtils.settingsGroupIconSize,
|
||||
),
|
||||
),
|
||||
title: Text(
|
||||
title,
|
||||
style: titleStyle ?? TextStyle(fontWeight: FontWeight.bold),
|
||||
maxLines: titleMaxLine,
|
||||
overflow: titleMaxLine != null ? overflow : null,
|
||||
),
|
||||
subtitle: (subtitle != null)
|
||||
? Text(
|
||||
subtitle!,
|
||||
style: subtitleStyle ?? Theme.of(context).textTheme.bodyMedium!,
|
||||
maxLines: subtitleMaxLine,
|
||||
overflow: subtitleMaxLine != null
|
||||
? TextOverflow.ellipsis
|
||||
: null,
|
||||
)
|
||||
: null,
|
||||
trailing: (trailing != null) ? trailing : Icon(Icons.navigate_next),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
70
lib/src/easy_component_simple_user_card.dart
Normal file
70
lib/src/easy_component_simple_user_card.dart
Normal file
@@ -0,0 +1,70 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class SimpleUserCard extends StatelessWidget {
|
||||
final ImageProvider userProfilePic;
|
||||
final String userName;
|
||||
final double? imageRadius;
|
||||
final Widget? userMoreInfo;
|
||||
final VoidCallback? onTap;
|
||||
final TextStyle? textStyle;
|
||||
final Icon? icon;
|
||||
|
||||
const SimpleUserCard({
|
||||
super.key,
|
||||
required this.userProfilePic,
|
||||
required this.userName,
|
||||
this.imageRadius = 10,
|
||||
this.userMoreInfo,
|
||||
this.onTap,
|
||||
this.textStyle,
|
||||
this.icon,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
double mediaQueryHeight = MediaQuery.of(context).size.height;
|
||||
double mediaQueryWidth = MediaQuery.of(context).size.width;
|
||||
return SizedBox(
|
||||
width: mediaQueryWidth,
|
||||
height: mediaQueryHeight / 3,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
GestureDetector(
|
||||
onTap: (onTap == null) ? () {} : onTap,
|
||||
child: Stack(
|
||||
children: [
|
||||
ClipRRect(
|
||||
borderRadius: BorderRadius.circular(imageRadius!),
|
||||
child: Image(
|
||||
image: userProfilePic,
|
||||
fit: BoxFit.cover,
|
||||
height: mediaQueryHeight / 5,
|
||||
width: mediaQueryWidth / 2.6,
|
||||
),
|
||||
),
|
||||
IconButton(
|
||||
onPressed: () {},
|
||||
icon: (icon != null)
|
||||
? icon!
|
||||
: Icon(Icons.camera, color: Colors.transparent),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
Container(
|
||||
margin: EdgeInsets.only(top: 3),
|
||||
child: Text(
|
||||
userName,
|
||||
style: (textStyle == null)
|
||||
? TextStyle(fontWeight: FontWeight.bold, fontSize: 20)
|
||||
: textStyle,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
97
lib/src/easy_component_small_user_card.dart
Normal file
97
lib/src/easy_component_small_user_card.dart
Normal file
@@ -0,0 +1,97 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class SmallUserCard extends StatelessWidget {
|
||||
final Color? cardColor;
|
||||
final double? cardRadius;
|
||||
final Color? backgroundMotifColor;
|
||||
final VoidCallback? onTap;
|
||||
final String? userName;
|
||||
final Widget? userMoreInfo;
|
||||
final ImageProvider userProfilePic;
|
||||
|
||||
const SmallUserCard({
|
||||
super.key,
|
||||
required this.cardColor,
|
||||
this.cardRadius = 30,
|
||||
required this.userName,
|
||||
this.backgroundMotifColor = Colors.white,
|
||||
this.userMoreInfo,
|
||||
required this.userProfilePic,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
var mediaQueryHeight = MediaQuery.of(context).size.height;
|
||||
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
height: mediaQueryHeight / 6,
|
||||
margin: EdgeInsets.only(bottom: 20),
|
||||
decoration: BoxDecoration(
|
||||
color: cardColor,
|
||||
borderRadius: BorderRadius.circular(
|
||||
double.parse(cardRadius!.toString()),
|
||||
),
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
Align(
|
||||
alignment: Alignment.bottomLeft,
|
||||
child: CircleAvatar(
|
||||
radius: 100,
|
||||
backgroundColor: backgroundMotifColor!.withValues(alpha: .1),
|
||||
),
|
||||
),
|
||||
Align(
|
||||
alignment: Alignment.center,
|
||||
child: CircleAvatar(
|
||||
radius: 400,
|
||||
backgroundColor: backgroundMotifColor!.withValues(alpha: .05),
|
||||
),
|
||||
),
|
||||
Container(
|
||||
margin: EdgeInsets.all(10),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||||
children: [
|
||||
Expanded(
|
||||
child: CircleAvatar(
|
||||
radius: mediaQueryHeight / 18,
|
||||
backgroundImage: userProfilePic,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
userName!,
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 26,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
if (userMoreInfo != null) ...[userMoreInfo!],
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
15
lib/src/icon_style.dart
Normal file
15
lib/src/icon_style.dart
Normal file
@@ -0,0 +1,15 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class IconStyle {
|
||||
Color? iconsColor;
|
||||
bool? withBackground;
|
||||
Color? backgroundColor;
|
||||
double? borderRadius;
|
||||
|
||||
IconStyle({
|
||||
this.iconsColor = Colors.white,
|
||||
this.withBackground = true,
|
||||
this.backgroundColor = Colors.blue,
|
||||
double borderRadius = 8,
|
||||
}) : borderRadius = borderRadius.toDouble();
|
||||
}
|
6
lib/src/settings_screen_utils.dart
Normal file
6
lib/src/settings_screen_utils.dart
Normal file
@@ -0,0 +1,6 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class SettingsScreenUtils {
|
||||
static double? settingsGroupIconSize;
|
||||
static TextStyle? settingsGroupTitleStyle;
|
||||
}
|
Reference in New Issue
Block a user