162 lines
5.9 KiB
Dart
162 lines
5.9 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:go_router/go_router.dart';
|
|
import 'package:intl/intl.dart';
|
|
import 'package:moody/views/write_page/widget/why_widget.dart';
|
|
|
|
class WritePage extends StatefulWidget {
|
|
final double moodPercentage;
|
|
|
|
const WritePage({Key? key, required this.moodPercentage}) : super(key: key);
|
|
@override
|
|
_WritePageState createState() => _WritePageState();
|
|
}
|
|
|
|
class _WritePageState extends State<WritePage> {
|
|
double _sliderValue = 0.0;
|
|
bool _sliderChanged = true;
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_sliderValue = widget.moodPercentage; // Set the value here
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return MaterialApp(
|
|
home: Scaffold(
|
|
body: SafeArea(
|
|
child: SingleChildScrollView(
|
|
child: Stack(
|
|
children: [
|
|
// Background circle
|
|
Positioned.fill(
|
|
child: CustomPaint(
|
|
painter: CirclePainter(_sliderValue),
|
|
),
|
|
),
|
|
// Main content
|
|
Padding(
|
|
padding: const EdgeInsets.fromLTRB(25, 175, 25, 25),
|
|
|
|
// padding: const EdgeInsets.all(25.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: <Widget>[
|
|
// Date
|
|
Text(
|
|
"${DateFormat('dd MM yyyy').format(DateTime.now())}",
|
|
style: TextStyle(fontSize: 18),
|
|
),
|
|
SizedBox(height: 10),
|
|
// Text prompt
|
|
Text(
|
|
"how fullfilled do you feel today?",
|
|
style: TextStyle(
|
|
fontSize: 22, fontWeight: FontWeight.bold),
|
|
),
|
|
SizedBox(height: 32), // 2 line padding
|
|
// Slider and label
|
|
Row(
|
|
children: [
|
|
Expanded(
|
|
child: SliderTheme(
|
|
data: SliderTheme.of(context).copyWith(
|
|
disabledThumbColor: Colors.amber,
|
|
activeTrackColor: Colors.black,
|
|
trackShape: RectangularSliderTrackShape(),
|
|
inactiveTickMarkColor: Colors.red,
|
|
inactiveTrackColor: Colors.transparent,
|
|
valueIndicatorColor: Colors.purple,
|
|
overlayColor: Colors.transparent,
|
|
activeTickMarkColor: Colors.red,
|
|
showValueIndicator: ShowValueIndicator.always,
|
|
trackHeight: 2,
|
|
thumbColor: Colors.transparent,
|
|
thumbShape: RoundSliderThumbShape(
|
|
enabledThumbRadius: 0.0),
|
|
rangeThumbShape: RoundRangeSliderThumbShape(
|
|
disabledThumbRadius: 0,
|
|
enabledThumbRadius: 0,
|
|
elevation: 22),
|
|
),
|
|
child: Slider(
|
|
min: 0.0,
|
|
max: 100.0,
|
|
value: _sliderValue,
|
|
onChanged: (value) {
|
|
setState(() {
|
|
_sliderValue = value;
|
|
_sliderChanged = true;
|
|
});
|
|
},
|
|
),
|
|
),
|
|
),
|
|
// Arrow icon
|
|
if (!_sliderChanged) Icon(Icons.arrow_forward),
|
|
],
|
|
),
|
|
// Drag me label
|
|
if (!_sliderChanged)
|
|
Align(
|
|
alignment: Alignment.centerLeft,
|
|
child: Padding(
|
|
padding: const EdgeInsets.only(top: 8.0),
|
|
child: Text("Drag me"),
|
|
),
|
|
),
|
|
// Slider percentage
|
|
if (_sliderValue > 0)
|
|
Text(
|
|
"${_sliderValue.toStringAsFixed(0)}%",
|
|
style: TextStyle(fontSize: 18),
|
|
),
|
|
// Why? button
|
|
TextButton(
|
|
onPressed: () {
|
|
context.go('/write', extra: _sliderValue);
|
|
|
|
// Implement your why? functionality here
|
|
},
|
|
child: WhyWidget(),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
// Skip/Save button
|
|
Positioned(
|
|
bottom: 20,
|
|
right: 20,
|
|
child: TextButton(
|
|
onPressed: () {},
|
|
child: Text(_sliderChanged ? "Save" : "Skip"),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
class CirclePainter extends CustomPainter {
|
|
final double value;
|
|
|
|
CirclePainter(this.value);
|
|
|
|
@override
|
|
void paint(Canvas canvas, Size size) {
|
|
var paint = Paint()
|
|
..color = Colors.greenAccent.withOpacity(0.5)
|
|
..style = PaintingStyle.fill;
|
|
|
|
double radius = value * size.width / 100 * 1.5;
|
|
canvas.drawCircle(Offset(size.width / 6, size.height / 4), radius, paint);
|
|
}
|
|
|
|
@override
|
|
bool shouldRepaint(covariant CustomPainter oldDelegate) => true;
|
|
}
|