mirror of
https://github.com/cake-tech/cake_wallet.git
synced 2024-11-17 09:47:35 +00:00
redesigh checkbox
This commit is contained in:
parent
ff28dfbb9c
commit
c57507e530
3 changed files with 39 additions and 109 deletions
|
@ -1,12 +1,12 @@
|
|||
import 'dart:ui';
|
||||
import 'package:cake_wallet/palette.dart';
|
||||
import 'package:cake_wallet/src/screens/dashboard/widgets/filter_tile.dart';
|
||||
import 'package:cake_wallet/src/widgets/standard_checkbox.dart';
|
||||
import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:cake_wallet/src/widgets/alert_background.dart';
|
||||
import 'package:cake_wallet/src/widgets/alert_close_button.dart';
|
||||
import 'package:cake_wallet/src/widgets/rounded_checkbox.dart';
|
||||
import 'package:cake_wallet/generated/i18n.dart';
|
||||
import 'package:flutter_mobx/flutter_mobx.dart';
|
||||
//import 'package:date_range_picker/date_range_picker.dart' as date_rage_picker;
|
||||
|
@ -97,14 +97,13 @@ class FilterWidget extends StatelessWidget {
|
|||
final content = item.onChanged != null
|
||||
? Observer(
|
||||
builder: (_) =>
|
||||
RoundedCheckboxWidget(
|
||||
StandardCheckbox(
|
||||
value: item.value.value,
|
||||
caption: item.caption,
|
||||
onChanged: item.onChanged,
|
||||
currentTheme:
|
||||
dashboardViewModel
|
||||
.settingsStore
|
||||
.currentTheme,
|
||||
gradientBackground: true,
|
||||
borderColor: Theme.of(context).dividerColor,
|
||||
iconColor: Colors.white,
|
||||
onChanged: (bool val){},
|
||||
))
|
||||
: GestureDetector(
|
||||
onTap: () async {
|
||||
|
|
|
@ -1,91 +0,0 @@
|
|||
import 'package:cake_wallet/palette.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:cake_wallet/themes/theme_base.dart';
|
||||
|
||||
class RoundedCheckboxWidget extends StatelessWidget {
|
||||
RoundedCheckboxWidget(
|
||||
{required this.value,
|
||||
required this.caption,
|
||||
required this.onChanged,
|
||||
this.currentTheme});
|
||||
|
||||
final bool value;
|
||||
final String caption;
|
||||
final Function onChanged;
|
||||
final ThemeBase? currentTheme;
|
||||
|
||||
bool get darkTheme => currentTheme!.type == ThemeType.dark;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
|
||||
final baseGradient = LinearGradient(colors: [
|
||||
Theme.of(context).primaryTextTheme.subtitle1!.color!,
|
||||
Theme.of(context).primaryTextTheme.subtitle1!.decorationColor!,
|
||||
], begin: Alignment.centerLeft, end: Alignment.centerRight);
|
||||
|
||||
final darkThemeGradient = LinearGradient(colors: [
|
||||
Palette.blueCraiola,
|
||||
Palette.blueGreyCraiola,
|
||||
], begin: Alignment.topLeft, end: Alignment.bottomRight);
|
||||
|
||||
final gradient = darkTheme ? darkThemeGradient : baseGradient;
|
||||
|
||||
final uncheckedColor = darkTheme
|
||||
? Theme.of(context).primaryTextTheme.subtitle1!.decorationColor!
|
||||
: Colors.white;
|
||||
|
||||
final borderColor = darkTheme
|
||||
? Theme.of(context).accentTextTheme.subtitle2!.backgroundColor!
|
||||
: Colors.transparent;
|
||||
|
||||
final checkedOuterBoxDecoration =
|
||||
BoxDecoration(shape: BoxShape.circle, gradient: gradient);
|
||||
final outerBoxDecoration = BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: Theme.of(context).accentTextTheme.overline!.color!,
|
||||
border: Border.all(color: borderColor));
|
||||
|
||||
final checkedInnerBoxDecoration =
|
||||
BoxDecoration(shape: BoxShape.circle, color: Colors.white);
|
||||
final innerBoxDecoration =
|
||||
BoxDecoration(shape: BoxShape.circle, color: uncheckedColor);
|
||||
|
||||
return GestureDetector(
|
||||
onTap: () => onChanged(),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Container(
|
||||
height: 24.0,
|
||||
width: 24.0,
|
||||
child: DecoratedBox(
|
||||
decoration:
|
||||
value ? checkedOuterBoxDecoration : outerBoxDecoration,
|
||||
child: Padding(
|
||||
padding: EdgeInsets.all(value ? 4.0 : 1.0),
|
||||
child: DecoratedBox(
|
||||
decoration:
|
||||
value ? checkedInnerBoxDecoration : innerBoxDecoration,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: EdgeInsets.only(left: 16),
|
||||
child: Text(
|
||||
caption,
|
||||
style: TextStyle(
|
||||
color: Theme.of(context).primaryTextTheme.headline6!.color!,
|
||||
fontSize: 18,
|
||||
fontFamily: 'Lato',
|
||||
fontWeight: FontWeight.w500,
|
||||
decoration: TextDecoration.none),
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
|
@ -7,11 +7,17 @@ class StandardCheckbox extends StatefulWidget {
|
|||
Key? key,
|
||||
required this.value,
|
||||
this.caption = '',
|
||||
this.gradientBackground = false,
|
||||
this.borderColor,
|
||||
this.iconColor,
|
||||
required this.onChanged})
|
||||
: super(key: key);
|
||||
|
||||
final bool value;
|
||||
final String caption;
|
||||
final bool gradientBackground;
|
||||
final Color? borderColor;
|
||||
final Color? iconColor;
|
||||
final Function(bool) onChanged;
|
||||
|
||||
@override
|
||||
|
@ -32,6 +38,31 @@ class StandardCheckboxState extends State<StandardCheckbox> {
|
|||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
|
||||
final baseGradient = LinearGradient(colors: [
|
||||
Theme.of(context).primaryTextTheme.subtitle1!.color!,
|
||||
Theme.of(context).primaryTextTheme.subtitle1!.decorationColor!,
|
||||
], begin: Alignment.centerLeft, end: Alignment.centerRight);
|
||||
|
||||
final boxBorder = Border.all(
|
||||
color: widget.borderColor ?? Theme.of(context)
|
||||
.primaryTextTheme
|
||||
.caption!
|
||||
.color!,
|
||||
width: 1.0);
|
||||
|
||||
|
||||
final checkedBoxDecoration = BoxDecoration(
|
||||
gradient: widget.gradientBackground ? baseGradient : null,
|
||||
border: widget.gradientBackground ? null : boxBorder,
|
||||
borderRadius: BorderRadius.all(
|
||||
Radius.circular(8.0)));
|
||||
|
||||
final uncheckedBoxDecoration = BoxDecoration(
|
||||
border: boxBorder,
|
||||
borderRadius: BorderRadius.all(
|
||||
Radius.circular(8.0)));
|
||||
|
||||
return GestureDetector(
|
||||
onTap: () {
|
||||
value = !value;
|
||||
|
@ -45,20 +76,11 @@ class StandardCheckboxState extends State<StandardCheckbox> {
|
|||
Container(
|
||||
height: 24.0,
|
||||
width: 24.0,
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(
|
||||
color: Theme.of(context)
|
||||
.primaryTextTheme!
|
||||
.caption!
|
||||
.color!,
|
||||
width: 1.0),
|
||||
borderRadius: BorderRadius.all(
|
||||
Radius.circular(8.0)),
|
||||
color: Theme.of(context).backgroundColor),
|
||||
decoration: value ? checkedBoxDecoration : uncheckedBoxDecoration,
|
||||
child: value
|
||||
? Icon(
|
||||
Icons.check,
|
||||
color: Colors.blue,
|
||||
color: widget.iconColor ?? Colors.blue,
|
||||
size: 20.0,
|
||||
)
|
||||
: Offstage(),
|
||||
|
|
Loading…
Reference in a new issue