CreateGroupView erstellt #28
@@ -1,4 +1,4 @@
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart' hide ButtonStyle;
|
||||||
import 'package:game_tracker/core/custom_theme.dart';
|
import 'package:game_tracker/core/custom_theme.dart';
|
||||||
import 'package:game_tracker/data/db/database.dart';
|
import 'package:game_tracker/data/db/database.dart';
|
||||||
import 'package:game_tracker/data/dto/group.dart';
|
import 'package:game_tracker/data/dto/group.dart';
|
||||||
@@ -265,8 +265,8 @@ class _CreateGroupViewState extends State<CreateGroupView> {
|
|||||||
),
|
),
|
||||||
CustomWidthButton(
|
CustomWidthButton(
|
||||||
text: 'Create group',
|
text: 'Create group',
|
||||||
disabledInfillColor: CustomTheme.boxColor,
|
|
||||||
sizeRelativeToWidth: 0.95,
|
sizeRelativeToWidth: 0.95,
|
||||||
|
buttonStyle: ButtonStyle.secondary,
|
||||||
onPressed:
|
onPressed:
|
||||||
(_groupNameController.text.isEmpty || selectedPlayers.isEmpty)
|
(_groupNameController.text.isEmpty || selectedPlayers.isEmpty)
|
||||||
? null
|
? null
|
||||||
@@ -277,14 +277,13 @@ class _CreateGroupViewState extends State<CreateGroupView> {
|
|||||||
members: selectedPlayers,
|
members: selectedPlayers,
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
|
if (!context.mounted) return;
|
||||||
if (success) {
|
if (success) {
|
||||||
_groupNameController.clear();
|
_groupNameController.clear();
|
||||||
_searchBarController.clear();
|
_searchBarController.clear();
|
||||||
selectedPlayers.clear();
|
selectedPlayers.clear();
|
||||||
if (!mounted) return;
|
|
||||||
Navigator.pop(context);
|
Navigator.pop(context);
|
||||||
} else {
|
} else {
|
||||||
if (!mounted) return;
|
|
||||||
ScaffoldMessenger.of(context).showSnackBar(
|
ScaffoldMessenger.of(context).showSnackBar(
|
||||||
SnackBar(
|
SnackBar(
|
||||||
backgroundColor: CustomTheme.boxColor,
|
backgroundColor: CustomTheme.boxColor,
|
||||||
|
|||||||
@@ -7,45 +7,67 @@ class CustomWidthButton extends StatelessWidget {
|
|||||||
const CustomWidthButton({
|
const CustomWidthButton({
|
||||||
super.key,
|
super.key,
|
||||||
required this.text,
|
required this.text,
|
||||||
this.disabledInfillColor,
|
|
||||||
this.buttonStyle = ButtonStyle.primary,
|
this.buttonStyle = ButtonStyle.primary,
|
||||||
|
sneeex marked this conversation as resolved
Outdated
|
|||||||
required this.sizeRelativeToWidth,
|
required this.sizeRelativeToWidth,
|
||||||
required this.onPressed,
|
this.onPressed,
|
||||||
});
|
});
|
||||||
|
|
||||||
final String text;
|
final String text;
|
||||||
final Color? disabledInfillColor;
|
|
||||||
final double sizeRelativeToWidth;
|
final double sizeRelativeToWidth;
|
||||||
final VoidCallback? onPressed;
|
final VoidCallback? onPressed;
|
||||||
final ButtonStyle buttonStyle;
|
final ButtonStyle buttonStyle;
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
|
|
||||||
|
final Color buttonBackgroundColor;
|
||||||
|
final Color disabledBackgroundColor;
|
||||||
|
final Color borderSideColor;
|
||||||
|
final Color disabledBorderSideColor;
|
||||||
|
final Color textcolor;
|
||||||
|
final Color disabledTextColor;
|
||||||
|
|
||||||
|
|
||||||
|
if(buttonStyle == ButtonStyle.primary){
|
||||||
|
buttonBackgroundColor = CustomTheme.primaryColor;
|
||||||
|
disabledBackgroundColor = CustomTheme.primaryColor.withValues(alpha: 0.24);
|
||||||
|
borderSideColor = Colors.transparent;
|
||||||
|
disabledBorderSideColor = Colors.transparent;
|
||||||
|
textcolor = Colors.white;
|
||||||
|
disabledTextColor = Colors.white.withValues(alpha: 0.24);
|
||||||
|
} else{
|
||||||
|
buttonBackgroundColor = Colors.transparent;
|
||||||
|
disabledBackgroundColor = Colors.transparent;
|
||||||
|
borderSideColor = CustomTheme.primaryColor.withValues(alpha: 0.6 );
|
||||||
|
disabledBorderSideColor = Colors.transparent;
|
||||||
|
textcolor = CustomTheme.primaryColor;
|
||||||
|
disabledTextColor = CustomTheme.primaryColor.withValues(alpha: 0.24);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
return ElevatedButton(
|
return ElevatedButton(
|
||||||
onPressed: onPressed,
|
onPressed: onPressed,
|
||||||
style: ElevatedButton.styleFrom(
|
style: ElevatedButton.styleFrom(
|
||||||
disabledBackgroundColor: disabledInfillColor,
|
disabledBackgroundColor: disabledBackgroundColor,
|
||||||
minimumSize: Size(
|
minimumSize: Size(
|
||||||
MediaQuery.sizeOf(context).width * sizeRelativeToWidth,
|
MediaQuery.sizeOf(context).width * sizeRelativeToWidth,
|
||||||
60,
|
60,
|
||||||
),
|
),
|
||||||
backgroundColor: buttonStyle == ButtonStyle.primary
|
backgroundColor: buttonBackgroundColor,
|
||||||
? CustomTheme.primaryColor
|
|
||||||
: CustomTheme.secondaryColor,
|
|
||||||
side: BorderSide(
|
side: BorderSide(
|
||||||
color: buttonStyle == ButtonStyle.primary
|
color: borderSideColor,
|
||||||
? CustomTheme.primaryColor
|
|
||||||
: CustomTheme.secondaryColor,
|
|
||||||
width: 2,
|
width: 2,
|
||||||
),
|
),
|
||||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
|
||||||
),
|
),
|
||||||
child: Text(
|
child: Text(
|
||||||
text,
|
text,
|
||||||
style: const TextStyle(
|
style: TextStyle(
|
||||||
fontWeight: FontWeight.w500,
|
fontWeight: FontWeight.w500,
|
||||||
fontSize: 22,
|
fontSize: 22,
|
||||||
color: Colors.white,
|
color: (onPressed == null)
|
||||||
|
? disabledTextColor
|
||||||
|
: textcolor,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user
Das was aktuell der disabledButton ist sollte lieber der Secondary Button sein. Deaktivierte Buttons sollten grau sein oder sowas, also klar als deaktiviert erkennbar sein.
Erläutere bitte, verstehe ich nicht
Dein Create Game Button sieht, wenn er deaktiviert ist, viel mehr aus wie ein Secondary Button.
Orientiere dich am besten daran: