added vertical line

This commit is contained in:
Komek Hayytnazarov 2024-07-29 11:40:26 +05:00
parent b3c71e46a3
commit 7c185e26cc
4 changed files with 91 additions and 39 deletions

View File

@ -4,6 +4,9 @@ sealed class AppColors {
static const Color primary = Color(0xFF343FDE);
static const Color yellow = Color(0xFFFFC71E);
static const Color surface = Color(0xFFEDEEFC);
static const Color green = Color(0xFFA2E052);
static const Color grey = Color(0xFF96969C);
static const Color darkGrey = Color(0xFF57575C);
static const Color CommonCyan = Color(0xff68C4C6);
static const Color GreyText = Color(0xff575757);
static const Color LightGrey = Color(0xfff1f1f1);

View File

@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import '../../configs/configs.dart';
import '../../core/core.dart';
import 'vertical_line.dart';
class OrderCard extends StatelessWidget {
const OrderCard({super.key});
@ -44,7 +45,7 @@ class OrderCard extends StatelessWidget {
/// status bar
Row(
children: [
const Icon(Icons.circle, color: Colors.green, size: 12),
const Icon(Icons.circle, color: AppColors.green, size: 12),
const SizedBox(width: 4),
Text(
'Ýolda',
@ -76,44 +77,11 @@ class OrderCard extends StatelessWidget {
children: [
SizedBox(
width: AppDimensions.normalize(15),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(
Icons.check_circle,
size: 16,
color: Colors.green,
),
SizedBox(
height: AppDimensions.normalize(7),
child: const VerticalDivider(
color: Colors.green,
width: 1,
indent: 0,
endIndent: 0,
thickness: 2,
),
),
const SizedBox(
width: 16,
child: Divider(
thickness: 2,
color: Colors.green,
),
),
SizedBox(
height: AppDimensions.normalize(7),
child: const VerticalDivider(
color: Color(0xFF96969C),
thickness: 2,
),
),
const Icon(
Icons.check_circle,
size: 16,
color: Color(0xFF96969C),
),
],
child: VerticalLine(
width: AppDimensions.normalize(6),
height: AppDimensions.normalize(40),
topColor: AppColors.green,
bottomColor: AppColors.grey,
),
),
Column(

View File

@ -0,0 +1,80 @@
import 'package:flutter/material.dart';
class VerticalLine extends StatelessWidget {
final double width;
final double height;
final Color topColor;
final Color bottomColor;
const VerticalLine({
super.key,
required this.width,
required this.height,
required this.topColor,
required this.bottomColor,
});
@override
Widget build(BuildContext context) {
return CustomPaint(
size: Size(width, height),
painter: VerticalLinePainter(topColor: topColor, bottomColor: bottomColor),
);
}
}
class VerticalLinePainter extends CustomPainter {
final Color topColor;
final Color bottomColor;
VerticalLinePainter({required this.topColor, required this.bottomColor});
@override
void paint(Canvas canvas, Size size) {
final paint = Paint()
..strokeWidth = size.width * 0.065
..style = PaintingStyle.stroke;
final circleRadius = size.width * 0.17;
final topCircleCenter = Offset(size.width / 2, size.height * 0.15);
final bottomCircleCenter = Offset(size.width / 2, size.height * 0.85);
// Draw top circle
paint.color = topColor;
canvas.drawCircle(topCircleCenter, circleRadius, paint);
// Draw top vertical line
final topLineStart = Offset(size.width / 2, topCircleCenter.dy + circleRadius);
final topLineEnd = Offset(size.width / 2, size.height * 0.5);
canvas.drawLine(topLineStart, topLineEnd, paint);
// Draw middle horizontal line
final horizontalLineY = size.height * 0.5;
canvas.drawLine(Offset(size.width * 0.35, horizontalLineY), Offset(size.width * 0.65, horizontalLineY), paint);
// Draw bottom vertical line
paint.color = bottomColor;
final bottomLineStart = Offset(size.width / 2, size.height * 0.5 + paint.strokeWidth / 2);
final bottomLineEnd = Offset(size.width / 2, bottomCircleCenter.dy - circleRadius);
canvas.drawLine(bottomLineStart, bottomLineEnd, paint);
// Draw bottom circle
canvas.drawCircle(bottomCircleCenter, circleRadius, paint);
// Draw inner circles
paint.style = PaintingStyle.fill;
// Top inner circle
paint.color = topColor;
canvas.drawCircle(topCircleCenter, circleRadius * 0.5, paint);
// Bottom inner circle
paint.color = bottomColor;
canvas.drawCircle(bottomCircleCenter, circleRadius * 0.5, paint);
}
@override
bool shouldRepaint(covariant CustomPainter oldDelegate) {
return false;
}
}

View File

@ -7,3 +7,4 @@ export 'location_card.dart';
export 'order_card.dart';
export 'order_header.dart';
export 'successful_auth_dialog.dart';
export 'vertical_line.dart';