mirror of
https://github.com/koloideal/Casha.git
synced 2026-06-10 18:35:28 +03:00
update
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:shared_preferences/shared_preferences.dart';
|
import 'package:shared_preferences/shared_preferences.dart';
|
||||||
|
|
||||||
enum GradientType { linear, radial, sweep, linearReverse }
|
enum GradientType { linear, linearReverse, radial, sweep, solid }
|
||||||
|
|
||||||
class CardColorService {
|
class CardColorService {
|
||||||
static const _key1 = 'card_color_primary';
|
static const _key1 = 'card_color_primary';
|
||||||
|
|||||||
@@ -119,6 +119,11 @@ class BalanceCardState extends ConsumerState<BalanceCard>
|
|||||||
],
|
],
|
||||||
stops: const [0.0, 0.25, 0.5, 0.75, 1.0],
|
stops: const [0.0, 0.25, 0.5, 0.75, 1.0],
|
||||||
);
|
);
|
||||||
|
case GradientType.solid:
|
||||||
|
return LinearGradient(
|
||||||
|
colors: [primary, primary, primary],
|
||||||
|
stops: const [0.0, 0.5, 1.0],
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -159,7 +164,7 @@ class BalanceCardState extends ConsumerState<BalanceCard>
|
|||||||
..rotateY(_tiltY * 0.42),
|
..rotateY(_tiltY * 0.42),
|
||||||
child: Container(
|
child: Container(
|
||||||
width: double.infinity,
|
width: double.infinity,
|
||||||
height: 180,
|
height: 220,
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
borderRadius: BorderRadius.circular(20),
|
borderRadius: BorderRadius.circular(20),
|
||||||
gradient: _buildGradient(primary, secondary, gradientType),
|
gradient: _buildGradient(primary, secondary, gradientType),
|
||||||
|
|||||||
@@ -29,9 +29,11 @@ class _FullScreenBlurOverlayState extends State<FullScreenBlurOverlay> {
|
|||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
final mq = MediaQuery.of(widget.context);
|
final mq = MediaQuery.of(widget.context);
|
||||||
final cardTop = mq.padding.top + kToolbarHeight + 16;
|
final cardTop = mq.padding.top + kToolbarHeight + 16;
|
||||||
final cardHeight = 180.0;
|
const cardHeight = 220.0;
|
||||||
final panelTop = cardTop + cardHeight + 50;
|
final panelTop = cardTop + cardHeight + 16;
|
||||||
final panelBottom = mq.padding.bottom + 16;
|
|
||||||
|
// Fixed panel height — smaller than before, no bottom stretching
|
||||||
|
const panelHeight = 310.0;
|
||||||
|
|
||||||
return Material(
|
return Material(
|
||||||
color: Colors.transparent,
|
color: Colors.transparent,
|
||||||
@@ -40,16 +42,12 @@ class _FullScreenBlurOverlayState extends State<FullScreenBlurOverlay> {
|
|||||||
Positioned.fill(
|
Positioned.fill(
|
||||||
child: BackdropFilter(
|
child: BackdropFilter(
|
||||||
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
|
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
|
||||||
child: Container(
|
child: Container(color: Colors.black.withOpacity(0.6)),
|
||||||
color: Colors.black.withOpacity(0.6),
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
Positioned.fill(
|
Positioned.fill(
|
||||||
child: GestureDetector(
|
child: GestureDetector(
|
||||||
onTap: () {
|
onTap: () => dash.closeOverlay(apply: false),
|
||||||
dash.closeOverlay(apply: false);
|
|
||||||
},
|
|
||||||
behavior: HitTestBehavior.translucent,
|
behavior: HitTestBehavior.translucent,
|
||||||
child: const SizedBox.expand(),
|
child: const SizedBox.expand(),
|
||||||
),
|
),
|
||||||
@@ -73,11 +71,11 @@ class _FullScreenBlurOverlayState extends State<FullScreenBlurOverlay> {
|
|||||||
top: panelTop,
|
top: panelTop,
|
||||||
left: 20,
|
left: 20,
|
||||||
right: 20,
|
right: 20,
|
||||||
bottom: panelBottom,
|
// No bottom — height is explicit, panel won't stretch to screen bottom
|
||||||
child: GestureDetector(
|
child: GestureDetector(
|
||||||
onTap: () {},
|
onTap: () {},
|
||||||
behavior: HitTestBehavior.opaque,
|
behavior: HitTestBehavior.opaque,
|
||||||
child: _buildPanel(context, mq),
|
child: _buildPanel(panelHeight),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
@@ -85,320 +83,469 @@ class _FullScreenBlurOverlayState extends State<FullScreenBlurOverlay> {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
Widget _buildPanel(BuildContext context, MediaQueryData mq) {
|
Widget _buildPanel(double panelHeight) {
|
||||||
return SingleChildScrollView(
|
return Container(
|
||||||
physics: const ClampingScrollPhysics(),
|
height: panelHeight,
|
||||||
child: Container(
|
decoration: BoxDecoration(
|
||||||
padding: const EdgeInsets.fromLTRB(20, 16, 20, 20),
|
color: Theme.of(widget.context).colorScheme.surface,
|
||||||
decoration: BoxDecoration(
|
borderRadius: BorderRadius.circular(20),
|
||||||
color: Theme.of(widget.context).colorScheme.surface,
|
boxShadow: [
|
||||||
borderRadius: BorderRadius.circular(20),
|
BoxShadow(
|
||||||
boxShadow: [
|
color: Colors.black.withOpacity(0.3),
|
||||||
BoxShadow(
|
blurRadius: 24,
|
||||||
color: Colors.black.withOpacity(0.3),
|
offset: const Offset(0, 8),
|
||||||
blurRadius: 24,
|
),
|
||||||
offset: const Offset(0, 8),
|
],
|
||||||
),
|
),
|
||||||
],
|
child: StatefulBuilder(
|
||||||
),
|
builder: (ctx, setPanelState) {
|
||||||
child: StatefulBuilder(
|
void onHSVChanged(HSVColor hsv) {
|
||||||
builder: (ctx, setPanelState) {
|
setPanelState(() {});
|
||||||
final isDark = Theme.of(widget.context).brightness == Brightness.dark;
|
dash.setState(() {
|
||||||
|
if (dash.editingPrimary) {
|
||||||
|
dash.tempPrimaryHSV = hsv;
|
||||||
|
dash.tempPrimary = hsv.toColor();
|
||||||
|
} else {
|
||||||
|
dash.tempSecondaryHSV = hsv;
|
||||||
|
dash.tempSecondary = hsv.toColor();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
dash.overlayEntry?.markNeedsBuild();
|
||||||
|
}
|
||||||
|
|
||||||
void onHSVChanged(HSVColor hsv) {
|
// In solid mode, editing is always "primary" (the solid color)
|
||||||
setPanelState(() {});
|
final currentHSV = dash.editingPrimary
|
||||||
dash.setState(() {
|
? dash.tempPrimaryHSV
|
||||||
if (dash.editingPrimary) {
|
: dash.tempSecondaryHSV;
|
||||||
dash.tempPrimaryHSV = hsv;
|
final isSolid = dash.tempGradientType == GradientType.solid;
|
||||||
dash.tempPrimary = hsv.toColor();
|
|
||||||
} else {
|
|
||||||
dash.tempSecondaryHSV = hsv;
|
|
||||||
dash.tempSecondary = hsv.toColor();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
dash.overlayEntry?.markNeedsBuild();
|
|
||||||
}
|
|
||||||
|
|
||||||
final currentHSV = dash.editingPrimary
|
return Padding(
|
||||||
? dash.tempPrimaryHSV
|
padding: const EdgeInsets.fromLTRB(16, 14, 16, 14),
|
||||||
: dash.tempSecondaryHSV;
|
child: Column(
|
||||||
|
mainAxisSize: MainAxisSize.max,
|
||||||
return Column(
|
|
||||||
mainAxisSize: MainAxisSize.min,
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
children: [
|
children: [
|
||||||
|
|
||||||
|
// ── Row 1: [──Primary──] [──Secondary──] | [Solid] [X] ──
|
||||||
Row(
|
Row(
|
||||||
children: [
|
children: [
|
||||||
PanelTab(
|
// Expanded tabs fill available width equally
|
||||||
label: 'Primary',
|
Expanded(
|
||||||
isSelected: dash.editingPrimary,
|
child: PanelTab(
|
||||||
color: dash.tempPrimary,
|
label: 'Primary',
|
||||||
|
isSelected: dash.editingPrimary && !isSolid,
|
||||||
|
color: dash.tempPrimary,
|
||||||
|
onTap: isSolid ? null : () {
|
||||||
|
dash.setState(() => dash.editingPrimary = true);
|
||||||
|
setPanelState(() {});
|
||||||
|
dash.overlayEntry?.markNeedsBuild();
|
||||||
|
},
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const SizedBox(width: 6),
|
||||||
|
Expanded(
|
||||||
|
child: PanelTab(
|
||||||
|
label: 'Secondary',
|
||||||
|
isSelected: !dash.editingPrimary && !isSolid,
|
||||||
|
color: dash.tempSecondary,
|
||||||
|
onTap: isSolid ? null : () {
|
||||||
|
dash.setState(() => dash.editingPrimary = false);
|
||||||
|
setPanelState(() {});
|
||||||
|
dash.overlayEntry?.markNeedsBuild();
|
||||||
|
},
|
||||||
|
),
|
||||||
|
),
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.symmetric(horizontal: 8),
|
||||||
|
child: Container(
|
||||||
|
width: 1,
|
||||||
|
height: 20,
|
||||||
|
color: Theme.of(widget.context)
|
||||||
|
.colorScheme
|
||||||
|
.onSurface
|
||||||
|
.withOpacity(0.15),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
// Solid toggle
|
||||||
|
GestureDetector(
|
||||||
onTap: () {
|
onTap: () {
|
||||||
dash.setState(() => dash.editingPrimary = true);
|
dash.setState(() {
|
||||||
|
dash.tempGradientType = isSolid
|
||||||
|
? GradientType.linear
|
||||||
|
: GradientType.solid;
|
||||||
|
});
|
||||||
setPanelState(() {});
|
setPanelState(() {});
|
||||||
dash.overlayEntry?.markNeedsBuild();
|
dash.overlayEntry?.markNeedsBuild();
|
||||||
},
|
},
|
||||||
|
child: AnimatedContainer(
|
||||||
|
duration: const Duration(milliseconds: 150),
|
||||||
|
padding: const EdgeInsets.symmetric(
|
||||||
|
horizontal: 10, vertical: 6),
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: isSolid
|
||||||
|
? const Color(0xFF7C6DED).withOpacity(0.15)
|
||||||
|
: Colors.transparent,
|
||||||
|
borderRadius: BorderRadius.circular(10),
|
||||||
|
border: Border.all(
|
||||||
|
color: isSolid
|
||||||
|
? const Color(0xFF7C6DED)
|
||||||
|
: Theme.of(widget.context)
|
||||||
|
.colorScheme
|
||||||
|
.onSurface
|
||||||
|
.withOpacity(0.2),
|
||||||
|
width: 1.5,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
child: Text(
|
||||||
|
'Solid',
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 11,
|
||||||
|
fontWeight: isSolid
|
||||||
|
? FontWeight.w600
|
||||||
|
: FontWeight.normal,
|
||||||
|
color: isSolid
|
||||||
|
? const Color(0xFF7C6DED)
|
||||||
|
: Theme.of(widget.context)
|
||||||
|
.colorScheme
|
||||||
|
.onSurface
|
||||||
|
.withOpacity(0.5),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(width: 10),
|
const SizedBox(width: 8),
|
||||||
PanelTab(
|
// Close button
|
||||||
label: 'Secondary',
|
|
||||||
isSelected: !dash.editingPrimary,
|
|
||||||
color: dash.tempSecondary,
|
|
||||||
onTap: () {
|
|
||||||
dash.setState(() => dash.editingPrimary = false);
|
|
||||||
setPanelState(() {});
|
|
||||||
dash.overlayEntry?.markNeedsBuild();
|
|
||||||
},
|
|
||||||
),
|
|
||||||
const Spacer(),
|
|
||||||
GestureDetector(
|
GestureDetector(
|
||||||
onTap: () => dash.closeOverlay(apply: false),
|
onTap: () => dash.closeOverlay(apply: false),
|
||||||
child: Container(
|
child: Container(
|
||||||
width: 32,
|
width: 30,
|
||||||
height: 32,
|
height: 30,
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
color: const Color(0xFFE05C6B).withOpacity(0.15),
|
color: const Color(0xFFE05C6B).withOpacity(0.15),
|
||||||
shape: BoxShape.circle,
|
shape: BoxShape.circle,
|
||||||
),
|
),
|
||||||
child: const Icon(
|
child: const Icon(Icons.close_rounded,
|
||||||
Icons.close_rounded,
|
size: 16, color: Color(0xFFE05C6B)),
|
||||||
size: 18,
|
|
||||||
color: Color(0xFFE05C6B),
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
const SizedBox(height: 16),
|
|
||||||
ClipRRect(
|
|
||||||
borderRadius: BorderRadius.circular(12),
|
|
||||||
child: SizedBox(
|
|
||||||
height: 160,
|
|
||||||
width: double.infinity,
|
|
||||||
child: ColorPickerArea(
|
|
||||||
currentHSV,
|
|
||||||
onHSVChanged,
|
|
||||||
PaletteType.hsvWithHue,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
const SizedBox(height: 12),
|
|
||||||
ClipRRect(
|
|
||||||
borderRadius: BorderRadius.circular(6),
|
|
||||||
child: SizedBox(
|
|
||||||
height: 22,
|
|
||||||
child: ColorPickerSlider(
|
|
||||||
TrackType.hue,
|
|
||||||
currentHSV,
|
|
||||||
onHSVChanged,
|
|
||||||
displayThumbColor: true,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
const SizedBox(height: 12),
|
|
||||||
Row(
|
|
||||||
children: [
|
|
||||||
GestureDetector(
|
|
||||||
onTap: () {
|
|
||||||
dash.setState(() => dash.editingPrimary = true);
|
|
||||||
setPanelState(() {});
|
|
||||||
dash.overlayEntry?.markNeedsBuild();
|
|
||||||
},
|
|
||||||
child: Row(
|
|
||||||
mainAxisSize: MainAxisSize.min,
|
|
||||||
children: [
|
|
||||||
Container(
|
|
||||||
width: 28,
|
|
||||||
height: 28,
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
color: dash.tempPrimary,
|
|
||||||
borderRadius: BorderRadius.circular(8),
|
|
||||||
border: dash.editingPrimary
|
|
||||||
? Border.all(color: Colors.white, width: 2)
|
|
||||||
: Border.all(
|
|
||||||
color: Colors.transparent, width: 2),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
const SizedBox(width: 8),
|
|
||||||
Text(
|
|
||||||
'#${dash.tempPrimary.value.toRadixString(16).substring(2).toUpperCase()}',
|
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 12,
|
|
||||||
fontFamily: 'monospace',
|
|
||||||
fontWeight: dash.editingPrimary
|
|
||||||
? FontWeight.w600
|
|
||||||
: FontWeight.normal,
|
|
||||||
color: Theme.of(widget.context)
|
|
||||||
.colorScheme
|
|
||||||
.onSurface
|
|
||||||
.withOpacity(
|
|
||||||
dash.editingPrimary ? 0.8 : 0.4,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
const Spacer(),
|
|
||||||
GestureDetector(
|
|
||||||
onTap: () {
|
|
||||||
dash.setState(() => dash.editingPrimary = false);
|
|
||||||
setPanelState(() {});
|
|
||||||
dash.overlayEntry?.markNeedsBuild();
|
|
||||||
},
|
|
||||||
child: Row(
|
|
||||||
mainAxisSize: MainAxisSize.min,
|
|
||||||
children: [
|
|
||||||
Text(
|
|
||||||
'#${dash.tempSecondary.value.toRadixString(16).substring(2).toUpperCase()}',
|
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 12,
|
|
||||||
fontFamily: 'monospace',
|
|
||||||
fontWeight: !dash.editingPrimary
|
|
||||||
? FontWeight.w600
|
|
||||||
: FontWeight.normal,
|
|
||||||
color: Theme.of(widget.context)
|
|
||||||
.colorScheme
|
|
||||||
.onSurface
|
|
||||||
.withOpacity(
|
|
||||||
!dash.editingPrimary ? 0.8 : 0.4,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
const SizedBox(width: 8),
|
|
||||||
Container(
|
|
||||||
width: 28,
|
|
||||||
height: 28,
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
color: dash.tempSecondary,
|
|
||||||
borderRadius: BorderRadius.circular(8),
|
|
||||||
border: !dash.editingPrimary
|
|
||||||
? Border.all(color: Colors.white, width: 2)
|
|
||||||
: Border.all(
|
|
||||||
color: Colors.transparent, width: 2),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
const SizedBox(height: 16),
|
|
||||||
Text(
|
|
||||||
'Gradient Style',
|
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 12,
|
|
||||||
fontWeight: FontWeight.w500,
|
|
||||||
color: Theme.of(widget.context).colorScheme.onSurface.withOpacity(0.6),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
const SizedBox(height: 10),
|
const SizedBox(height: 10),
|
||||||
Row(
|
|
||||||
children: GradientType.values.map((type) {
|
// ── Spectrum + hue + preview ──
|
||||||
final isSelected = dash.tempGradientType == type;
|
// LayoutBuilder captures finite height from Expanded.
|
||||||
final label = switch (type) {
|
// Spectrum alone is wrapped in IgnorePointer when solid.
|
||||||
GradientType.linear => 'Linear',
|
// Hue slider is ALWAYS active (used to pick the solid color too).
|
||||||
GradientType.linearReverse => 'Reverse',
|
Expanded(
|
||||||
GradientType.radial => 'Radial',
|
child: LayoutBuilder(
|
||||||
GradientType.sweep => 'Sweep',
|
builder: (lbCtx, constraints) {
|
||||||
};
|
// Reserve space for: hue(20) + gap(8) + preview(26) + 2×gap(8) = 62
|
||||||
final icon = switch (type) {
|
const reservedBelow = 62.0;
|
||||||
GradientType.linear => Icons.trending_flat_rounded,
|
final spectrumH =
|
||||||
GradientType.linearReverse => Icons.swap_horiz_rounded,
|
(constraints.maxHeight - reservedBelow).clamp(
|
||||||
GradientType.radial => Icons.blur_circular_rounded,
|
40.0, double.infinity);
|
||||||
GradientType.sweep => Icons.rotate_right_rounded,
|
|
||||||
};
|
return Column(
|
||||||
return Expanded(
|
mainAxisSize: MainAxisSize.min,
|
||||||
child: Padding(
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||||
padding: const EdgeInsets.only(right: 8),
|
children: [
|
||||||
child: GestureDetector(
|
// Spectrum — dimmed & blocked in Solid mode
|
||||||
onTap: () {
|
IgnorePointer(
|
||||||
dash.setState(() => dash.tempGradientType = type);
|
ignoring: isSolid,
|
||||||
setPanelState(() {});
|
child: AnimatedOpacity(
|
||||||
dash.overlayEntry?.markNeedsBuild();
|
duration: const Duration(milliseconds: 200),
|
||||||
},
|
opacity: isSolid ? 0.3 : 1.0,
|
||||||
child: AnimatedContainer(
|
child: ClipRRect(
|
||||||
duration: const Duration(milliseconds: 150),
|
borderRadius: BorderRadius.circular(10),
|
||||||
padding: const EdgeInsets.symmetric(vertical: 8),
|
child: SizedBox(
|
||||||
decoration: BoxDecoration(
|
height: spectrumH,
|
||||||
color: isSelected
|
child: ColorPickerArea(
|
||||||
? const Color(0xFF7C6DED).withOpacity(0.15)
|
currentHSV,
|
||||||
: Theme.of(widget.context).colorScheme.onSurface.withOpacity(0.05),
|
onHSVChanged,
|
||||||
borderRadius: BorderRadius.circular(10),
|
PaletteType.hsvWithHue,
|
||||||
border: Border.all(
|
),
|
||||||
color: isSelected
|
),
|
||||||
? const Color(0xFF7C6DED)
|
|
||||||
: Colors.transparent,
|
|
||||||
width: 1.5,
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
child: Column(
|
),
|
||||||
mainAxisSize: MainAxisSize.min,
|
const SizedBox(height: 8),
|
||||||
children: [
|
// Hue slider — ALWAYS active (works for both gradient & solid)
|
||||||
Icon(
|
ClipRRect(
|
||||||
icon,
|
borderRadius: BorderRadius.circular(6),
|
||||||
size: 18,
|
child: SizedBox(
|
||||||
color: isSelected
|
height: 20,
|
||||||
? const Color(0xFF7C6DED)
|
child: ColorPickerSlider(
|
||||||
: Theme.of(widget.context).colorScheme.onSurface.withOpacity(0.5),
|
TrackType.hue,
|
||||||
),
|
currentHSV,
|
||||||
const SizedBox(height: 4),
|
onHSVChanged,
|
||||||
Text(
|
displayThumbColor: true,
|
||||||
label,
|
),
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 10,
|
|
||||||
fontWeight: isSelected ? FontWeight.w600 : FontWeight.normal,
|
|
||||||
color: isSelected
|
|
||||||
? const Color(0xFF7C6DED)
|
|
||||||
: Theme.of(widget.context).colorScheme.onSurface.withOpacity(0.5),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
const SizedBox(height: 8),
|
||||||
),
|
// Color hex preview row
|
||||||
);
|
IgnorePointer(
|
||||||
}).toList(),
|
ignoring: isSolid,
|
||||||
|
child: AnimatedOpacity(
|
||||||
|
duration: const Duration(milliseconds: 200),
|
||||||
|
opacity: isSolid ? 0.4 : 1.0,
|
||||||
|
child: SizedBox(
|
||||||
|
height: 26,
|
||||||
|
child: Row(
|
||||||
|
children: [
|
||||||
|
GestureDetector(
|
||||||
|
onTap: () {
|
||||||
|
dash.setState(
|
||||||
|
() => dash.editingPrimary = true);
|
||||||
|
setPanelState(() {});
|
||||||
|
dash.overlayEntry?.markNeedsBuild();
|
||||||
|
},
|
||||||
|
child: Row(
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
children: [
|
||||||
|
Container(
|
||||||
|
width: 22,
|
||||||
|
height: 22,
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: dash.tempPrimary,
|
||||||
|
borderRadius:
|
||||||
|
BorderRadius.circular(6),
|
||||||
|
border: dash.editingPrimary
|
||||||
|
? Border.all(
|
||||||
|
color: Colors.white,
|
||||||
|
width: 2)
|
||||||
|
: Border.all(
|
||||||
|
color: Colors.transparent,
|
||||||
|
width: 2),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const SizedBox(width: 5),
|
||||||
|
Text(
|
||||||
|
'#${dash.tempPrimary.value.toRadixString(16).substring(2).toUpperCase()}',
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 11,
|
||||||
|
fontFamily: 'monospace',
|
||||||
|
fontWeight: dash.editingPrimary
|
||||||
|
? FontWeight.w600
|
||||||
|
: FontWeight.normal,
|
||||||
|
color: Theme.of(widget.context)
|
||||||
|
.colorScheme
|
||||||
|
.onSurface
|
||||||
|
.withOpacity(
|
||||||
|
dash.editingPrimary
|
||||||
|
? 0.8
|
||||||
|
: 0.4),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const Spacer(),
|
||||||
|
if (!isSolid)
|
||||||
|
GestureDetector(
|
||||||
|
onTap: () {
|
||||||
|
dash.setState(() =>
|
||||||
|
dash.editingPrimary = false);
|
||||||
|
setPanelState(() {});
|
||||||
|
dash.overlayEntry?.markNeedsBuild();
|
||||||
|
},
|
||||||
|
child: Row(
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
children: [
|
||||||
|
Text(
|
||||||
|
'#${dash.tempSecondary.value.toRadixString(16).substring(2).toUpperCase()}',
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 11,
|
||||||
|
fontFamily: 'monospace',
|
||||||
|
fontWeight: !dash.editingPrimary
|
||||||
|
? FontWeight.w600
|
||||||
|
: FontWeight.normal,
|
||||||
|
color: Theme.of(widget.context)
|
||||||
|
.colorScheme
|
||||||
|
.onSurface
|
||||||
|
.withOpacity(
|
||||||
|
!dash.editingPrimary
|
||||||
|
? 0.8
|
||||||
|
: 0.4),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const SizedBox(width: 5),
|
||||||
|
Container(
|
||||||
|
width: 22,
|
||||||
|
height: 22,
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: dash.tempSecondary,
|
||||||
|
borderRadius:
|
||||||
|
BorderRadius.circular(6),
|
||||||
|
border: !dash.editingPrimary
|
||||||
|
? Border.all(
|
||||||
|
color: Colors.white,
|
||||||
|
width: 2)
|
||||||
|
: Border.all(
|
||||||
|
color:
|
||||||
|
Colors.transparent,
|
||||||
|
width: 2),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
},
|
||||||
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(height: 16),
|
|
||||||
|
const SizedBox(height: 8),
|
||||||
|
|
||||||
|
// ── Gradient type row (dimmed when Solid) ──
|
||||||
|
IgnorePointer(
|
||||||
|
ignoring: isSolid,
|
||||||
|
child: AnimatedOpacity(
|
||||||
|
duration: const Duration(milliseconds: 200),
|
||||||
|
opacity: isSolid ? 0.3 : 1.0,
|
||||||
|
child: Row(
|
||||||
|
children: GradientType.values
|
||||||
|
.where((t) => t != GradientType.solid)
|
||||||
|
.map((type) {
|
||||||
|
final isSelected = dash.tempGradientType == type;
|
||||||
|
final label = switch (type) {
|
||||||
|
GradientType.linear => 'Linear',
|
||||||
|
GradientType.linearReverse => 'Reverse',
|
||||||
|
GradientType.radial => 'Radial',
|
||||||
|
GradientType.sweep => 'Sweep',
|
||||||
|
GradientType.solid => '',
|
||||||
|
};
|
||||||
|
final icon = switch (type) {
|
||||||
|
GradientType.linear => Icons.trending_flat_rounded,
|
||||||
|
GradientType.linearReverse =>
|
||||||
|
Icons.swap_horiz_rounded,
|
||||||
|
GradientType.radial => Icons.blur_circular_rounded,
|
||||||
|
GradientType.sweep => Icons.rotate_right_rounded,
|
||||||
|
GradientType.solid => Icons.square_rounded,
|
||||||
|
};
|
||||||
|
return Expanded(
|
||||||
|
child: Padding(
|
||||||
|
padding: const EdgeInsets.only(right: 6),
|
||||||
|
child: GestureDetector(
|
||||||
|
onTap: () {
|
||||||
|
dash.setState(
|
||||||
|
() => dash.tempGradientType = type);
|
||||||
|
setPanelState(() {});
|
||||||
|
dash.overlayEntry?.markNeedsBuild();
|
||||||
|
},
|
||||||
|
child: AnimatedContainer(
|
||||||
|
duration: const Duration(milliseconds: 150),
|
||||||
|
padding:
|
||||||
|
const EdgeInsets.symmetric(vertical: 5),
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: isSelected
|
||||||
|
? const Color(0xFF7C6DED)
|
||||||
|
.withOpacity(0.15)
|
||||||
|
: Theme.of(widget.context)
|
||||||
|
.colorScheme
|
||||||
|
.onSurface
|
||||||
|
.withOpacity(0.05),
|
||||||
|
borderRadius: BorderRadius.circular(8),
|
||||||
|
border: Border.all(
|
||||||
|
color: isSelected
|
||||||
|
? const Color(0xFF7C6DED)
|
||||||
|
: Colors.transparent,
|
||||||
|
width: 1.5,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
child: Column(
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
children: [
|
||||||
|
Icon(icon,
|
||||||
|
size: 15,
|
||||||
|
color: isSelected
|
||||||
|
? const Color(0xFF7C6DED)
|
||||||
|
: Theme.of(widget.context)
|
||||||
|
.colorScheme
|
||||||
|
.onSurface
|
||||||
|
.withOpacity(0.45)),
|
||||||
|
const SizedBox(height: 2),
|
||||||
|
Text(
|
||||||
|
label,
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 9,
|
||||||
|
fontWeight: isSelected
|
||||||
|
? FontWeight.w600
|
||||||
|
: FontWeight.normal,
|
||||||
|
color: isSelected
|
||||||
|
? const Color(0xFF7C6DED)
|
||||||
|
: Theme.of(widget.context)
|
||||||
|
.colorScheme
|
||||||
|
.onSurface
|
||||||
|
.withOpacity(0.45),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}).toList(),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
|
||||||
|
const SizedBox(height: 8),
|
||||||
|
|
||||||
|
// ── Reset + Apply ──
|
||||||
Row(
|
Row(
|
||||||
children: [
|
children: [
|
||||||
Expanded(
|
Expanded(
|
||||||
child: OutlinedButton.icon(
|
child: OutlinedButton.icon(
|
||||||
onPressed: () {
|
onPressed: () {
|
||||||
final isDark = Theme.of(widget.context).brightness == Brightness.dark;
|
final isDarkTheme =
|
||||||
final defPrimary = isDark
|
Theme.of(widget.context).brightness ==
|
||||||
|
Brightness.dark;
|
||||||
|
final defP = isDarkTheme
|
||||||
? CardColorService.defaultPrimary
|
? CardColorService.defaultPrimary
|
||||||
: CardColorService.defaultPrimaryLight;
|
: CardColorService.defaultPrimaryLight;
|
||||||
final defSecondary = isDark
|
final defS = isDarkTheme
|
||||||
? CardColorService.defaultSecondary
|
? CardColorService.defaultSecondary
|
||||||
: CardColorService.defaultSecondaryLight;
|
: CardColorService.defaultSecondaryLight;
|
||||||
dash.setState(() {
|
dash.setState(() {
|
||||||
dash.tempPrimary = defPrimary;
|
dash.tempPrimary = defP;
|
||||||
dash.tempSecondary = defSecondary;
|
dash.tempSecondary = defS;
|
||||||
dash.tempPrimaryHSV = HSVColor.fromColor(defPrimary);
|
dash.tempPrimaryHSV = HSVColor.fromColor(defP);
|
||||||
dash.tempSecondaryHSV = HSVColor.fromColor(defSecondary);
|
dash.tempSecondaryHSV = HSVColor.fromColor(defS);
|
||||||
dash.tempGradientType = GradientType.linear;
|
dash.tempGradientType = GradientType.linear;
|
||||||
});
|
});
|
||||||
setPanelState(() {});
|
setPanelState(() {});
|
||||||
dash.overlayEntry?.markNeedsBuild();
|
dash.overlayEntry?.markNeedsBuild();
|
||||||
},
|
},
|
||||||
icon: const Icon(Icons.restart_alt_rounded, size: 16),
|
icon: const Icon(Icons.restart_alt_rounded, size: 15),
|
||||||
label: const Text('Reset'),
|
label: const Text('Reset',
|
||||||
|
style: TextStyle(fontSize: 13)),
|
||||||
style: OutlinedButton.styleFrom(
|
style: OutlinedButton.styleFrom(
|
||||||
foregroundColor: Theme.of(widget.context).colorScheme.onSurface.withOpacity(0.7),
|
foregroundColor: Theme.of(widget.context)
|
||||||
|
.colorScheme
|
||||||
|
.onSurface
|
||||||
|
.withOpacity(0.7),
|
||||||
side: BorderSide(
|
side: BorderSide(
|
||||||
color: Theme.of(widget.context).colorScheme.onSurface.withOpacity(0.2),
|
color: Theme.of(widget.context)
|
||||||
|
.colorScheme
|
||||||
|
.onSurface
|
||||||
|
.withOpacity(0.2),
|
||||||
),
|
),
|
||||||
padding: const EdgeInsets.symmetric(vertical: 14),
|
padding: const EdgeInsets.symmetric(vertical: 10),
|
||||||
shape: RoundedRectangleBorder(
|
shape: RoundedRectangleBorder(
|
||||||
borderRadius: BorderRadius.circular(14),
|
borderRadius: BorderRadius.circular(12)),
|
||||||
),
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(width: 12),
|
const SizedBox(width: 10),
|
||||||
Expanded(
|
Expanded(
|
||||||
flex: 2,
|
flex: 2,
|
||||||
child: ElevatedButton(
|
child: ElevatedButton(
|
||||||
@@ -406,23 +553,21 @@ class _FullScreenBlurOverlayState extends State<FullScreenBlurOverlay> {
|
|||||||
style: ElevatedButton.styleFrom(
|
style: ElevatedButton.styleFrom(
|
||||||
backgroundColor: const Color(0xFF7C6DED),
|
backgroundColor: const Color(0xFF7C6DED),
|
||||||
foregroundColor: Colors.white,
|
foregroundColor: Colors.white,
|
||||||
padding: const EdgeInsets.symmetric(vertical: 14),
|
padding: const EdgeInsets.symmetric(vertical: 10),
|
||||||
shape: RoundedRectangleBorder(
|
shape: RoundedRectangleBorder(
|
||||||
borderRadius: BorderRadius.circular(14),
|
borderRadius: BorderRadius.circular(12)),
|
||||||
),
|
|
||||||
),
|
|
||||||
child: const Text(
|
|
||||||
'Apply',
|
|
||||||
style: TextStyle(fontWeight: FontWeight.w700, fontSize: 15),
|
|
||||||
),
|
),
|
||||||
|
child: const Text('Apply',
|
||||||
|
style: TextStyle(
|
||||||
|
fontWeight: FontWeight.w700, fontSize: 14)),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
);
|
),
|
||||||
},
|
);
|
||||||
),
|
},
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@@ -432,20 +577,21 @@ class PanelTab extends StatelessWidget {
|
|||||||
final String label;
|
final String label;
|
||||||
final bool isSelected;
|
final bool isSelected;
|
||||||
final Color color;
|
final Color color;
|
||||||
final VoidCallback onTap;
|
final VoidCallback? onTap;
|
||||||
|
|
||||||
const PanelTab({
|
const PanelTab({
|
||||||
super.key,
|
super.key,
|
||||||
required this.label,
|
required this.label,
|
||||||
required this.isSelected,
|
required this.isSelected,
|
||||||
required this.color,
|
required this.color,
|
||||||
required this.onTap,
|
this.onTap,
|
||||||
});
|
});
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
final isDark = Theme.of(context).brightness == Brightness.dark;
|
final isDark = Theme.of(context).brightness == Brightness.dark;
|
||||||
final unselectedBorder = isDark ? Colors.white24 : const Color(0xFFCCCCDD);
|
final unselectedBorder =
|
||||||
|
isDark ? Colors.white24 : const Color(0xFFCCCCDD);
|
||||||
final unselectedText = isDark
|
final unselectedText = isDark
|
||||||
? Colors.white60
|
? Colors.white60
|
||||||
: Theme.of(context).colorScheme.onSurface.withOpacity(0.5);
|
: Theme.of(context).colorScheme.onSurface.withOpacity(0.5);
|
||||||
@@ -454,7 +600,9 @@ class PanelTab extends StatelessWidget {
|
|||||||
onTap: onTap,
|
onTap: onTap,
|
||||||
child: AnimatedContainer(
|
child: AnimatedContainer(
|
||||||
duration: const Duration(milliseconds: 150),
|
duration: const Duration(milliseconds: 150),
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
|
// Fill full width of Expanded slot (no padding-based width)
|
||||||
|
width: double.infinity,
|
||||||
|
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 8),
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
color: isSelected ? color.withOpacity(0.15) : Colors.transparent,
|
color: isSelected ? color.withOpacity(0.15) : Colors.transparent,
|
||||||
borderRadius: BorderRadius.circular(10),
|
borderRadius: BorderRadius.circular(10),
|
||||||
@@ -465,10 +613,11 @@ class PanelTab extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
child: Row(
|
child: Row(
|
||||||
mainAxisSize: MainAxisSize.min,
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
children: [
|
children: [
|
||||||
Container(
|
Container(
|
||||||
width: 14,
|
width: 10,
|
||||||
height: 14,
|
height: 10,
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
color: color,
|
color: color,
|
||||||
shape: BoxShape.circle,
|
shape: BoxShape.circle,
|
||||||
@@ -478,13 +627,19 @@ class PanelTab extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(width: 8),
|
const SizedBox(width: 6),
|
||||||
Text(
|
Flexible(
|
||||||
label,
|
child: Text(
|
||||||
style: TextStyle(
|
label,
|
||||||
fontSize: 13,
|
overflow: TextOverflow.ellipsis,
|
||||||
fontWeight: isSelected ? FontWeight.w600 : FontWeight.normal,
|
maxLines: 1,
|
||||||
color: isSelected ? color : unselectedText,
|
textAlign: TextAlign.center,
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 12,
|
||||||
|
fontWeight:
|
||||||
|
isSelected ? FontWeight.w600 : FontWeight.normal,
|
||||||
|
color: isSelected ? color : unselectedText,
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
|
|||||||
@@ -574,31 +574,43 @@ class _SettingsScreenState extends ConsumerState<SettingsScreen> {
|
|||||||
Padding(
|
Padding(
|
||||||
padding: const EdgeInsets.only(bottom: 24),
|
padding: const EdgeInsets.only(bottom: 24),
|
||||||
child: Center(
|
child: Center(
|
||||||
child: RichText(
|
child: Builder(
|
||||||
textAlign: TextAlign.center,
|
builder: (context) {
|
||||||
text: const TextSpan(
|
final isDark = Theme.of(context).brightness == Brightness.dark;
|
||||||
style: TextStyle(fontSize: 13, color: Colors.white30),
|
final baseColor = isDark
|
||||||
children: [
|
? Colors.white.withOpacity(0.25)
|
||||||
TextSpan(
|
: Colors.black.withOpacity(0.25);
|
||||||
text: 'casha',
|
final emphasisColor = isDark
|
||||||
style: TextStyle(
|
? Colors.white.withOpacity(0.35)
|
||||||
fontWeight: FontWeight.bold,
|
: Colors.black.withOpacity(0.35);
|
||||||
color: Colors.white38,
|
|
||||||
),
|
return RichText(
|
||||||
|
textAlign: TextAlign.center,
|
||||||
|
text: TextSpan(
|
||||||
|
style: TextStyle(fontSize: 13, color: baseColor),
|
||||||
|
children: [
|
||||||
|
TextSpan(
|
||||||
|
text: 'casha',
|
||||||
|
style: TextStyle(
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
color: emphasisColor,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
TextSpan(
|
||||||
|
text: ' powered with ❤️ by ',
|
||||||
|
style: TextStyle(fontStyle: FontStyle.italic),
|
||||||
|
),
|
||||||
|
TextSpan(
|
||||||
|
text: 'kolo',
|
||||||
|
style: TextStyle(
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
color: emphasisColor,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
),
|
),
|
||||||
TextSpan(
|
);
|
||||||
text: ' powered with ❤️ by ',
|
},
|
||||||
style: TextStyle(fontStyle: FontStyle.italic),
|
|
||||||
),
|
|
||||||
TextSpan(
|
|
||||||
text: 'kolo',
|
|
||||||
style: TextStyle(
|
|
||||||
fontWeight: FontWeight.bold,
|
|
||||||
color: Colors.white38,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
|||||||
Reference in New Issue
Block a user