feat: Added docs and cleanup

This commit is contained in:
Deven Joshi
2021-07-20 13:53:33 +05:30
parent 1939cc1bc8
commit ec1c2fce8c
@@ -4,68 +4,71 @@ import 'dart:ui' as ui;
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
/// Fallback user avatar with a polygon gradient overlayed with text
class GradientAvatar extends StatefulWidget { class GradientAvatar extends StatefulWidget {
final String name; /// Constructor for [GradientAvatar]
final String userId;
const GradientAvatar({ const GradientAvatar({
Key? key, Key? key,
required this.name, required this.name,
required this.userId, required this.userId,
}) : super(key: key); }) : super(key: key);
/// Name of user to shorten and display
final String name;
/// ID of user to be used for key
final String userId;
@override @override
_GradientAvatarState createState() => _GradientAvatarState(); _GradientAvatarState createState() => _GradientAvatarState();
} }
class _GradientAvatarState extends State<GradientAvatar> { class _GradientAvatarState extends State<GradientAvatar> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) => Center(
return Center( child: RepaintBoundary(
child: RepaintBoundary( child: SizedBox(
child: Container( width: 100,
width: 100.0, height: 100,
height: 100.0, child: Stack(
child: Stack( alignment: Alignment.center,
alignment: Alignment.center, children: [
children: [ CustomPaint(
CustomPaint( painter: DemoPainter(widget.userId),
painter: DemoPainter(widget.userId), child: const SizedBox.expand(),
child: SizedBox.expand(), ),
), FittedBox(
FittedBox( child: Padding(
child: Padding( padding: const EdgeInsets.all(32),
padding: const EdgeInsets.all(32.0), child: Opacity(
child: Opacity( opacity: 0.8,
opacity: 0.8, child: Text(
child: Text( getShortenedName(widget.name),
getShortenedName(widget.name), style: const TextStyle(
style: TextStyle( color: Colors.white,
color: Colors.white, fontSize: 112,
fontSize: 112.0, fontWeight: FontWeight.bold,
fontWeight: FontWeight.bold, ),
), ),
), ),
), ),
), ),
), ],
], ),
), ),
), ),
), );
);
}
String getShortenedName(String name) { String getShortenedName(String name) {
List<String> parts = name.split(' ')..removeWhere((e) => e == ''); var parts = name.split(' ')..removeWhere((e) => e == '');
if (parts.length > 2) { if (parts.length > 2) {
parts = parts.take(2).toList(); parts = parts.take(2).toList();
} }
String result = ''; var result = '';
for (int i = 0; i < parts.length; i++) { for (var i = 0; i < parts.length; i++) {
result = result + parts[i][0]; result = result + parts[i][0];
} }
@@ -73,60 +76,65 @@ class _GradientAvatarState extends State<GradientAvatar> {
} }
} }
/// Painter for bg polygon gradient
class DemoPainter extends CustomPainter { class DemoPainter extends CustomPainter {
/// Constructor for [DemoPainter]
DemoPainter(this.userId);
/// Init grid row count
static const int rowCount = 5; static const int rowCount = 5;
/// Init grid column count
static const int columnCount = 5; static const int columnCount = 5;
/// User ID used for key
String userId; String userId;
DemoPainter(this.userId);
@override @override
void paint(Canvas canvas, Size size) { void paint(Canvas canvas, Size size) {
var rowUnit = size.width / columnCount; final rowUnit = size.width / columnCount;
var columnUnit = size.height / rowCount; final columnUnit = size.height / rowCount;
var rand = Random(userId.length); final rand = Random(userId.length);
List<Offset4> squares = []; final squares = <Offset4>[];
Set<Offset> points = {}; final points = <Offset>{};
List<Color> gradient = colorGradients[rand.nextInt(colorGradients.length)]; final gradient = colorGradients[rand.nextInt(colorGradients.length)];
for (int i = 0; i < rowCount; i++) { for (var i = 0; i < rowCount; i++) {
for (int j = 0; j < columnCount; j++) { for (var j = 0; j < columnCount; j++) {
var off1 = Offset(rowUnit * j, columnUnit * i); final off1 = Offset(rowUnit * j, columnUnit * i);
var off2 = Offset(rowUnit * (j + 1), columnUnit * i); final off2 = Offset(rowUnit * (j + 1), columnUnit * i);
var off3 = Offset(rowUnit * (j + 1), columnUnit * (i + 1)); final off3 = Offset(rowUnit * (j + 1), columnUnit * (i + 1));
var off4 = Offset(rowUnit * j, columnUnit * (i + 1)); final off4 = Offset(rowUnit * j, columnUnit * (i + 1));
points.addAll([off1, off2, off3, off4]); points.addAll([off1, off2, off3, off4]);
var p1 = points.toList().indexOf(off1); final p1 = points.toList().indexOf(off1);
var p2 = points.toList().indexOf(off2); final p2 = points.toList().indexOf(off2);
var p3 = points.toList().indexOf(off3); final p3 = points.toList().indexOf(off3);
var p4 = points.toList().indexOf(off4); final p4 = points.toList().indexOf(off4);
squares.add( squares.add(
Offset4(p1, p2, p3, p4, i, j, rowCount, columnCount, gradient)); Offset4(p1, p2, p3, p4, i, j, rowCount, columnCount, gradient));
} }
} }
var list = transformPoints(points, size); final list = transformPoints(points, size);
squares.forEach((e) => e.draw(canvas, list)); squares.forEach((e) => e.draw(canvas, list));
} }
@override @override
bool shouldRepaint(covariant CustomPainter oldDelegate) { bool shouldRepaint(covariant CustomPainter oldDelegate) => false;
return false;
}
/// Transforms initial grid into a polygon grid
List<Offset> transformPoints(Set<Offset> points, Size size) { List<Offset> transformPoints(Set<Offset> points, Size size) {
List<Offset> transformedList = []; final transformedList = <Offset>[];
var orgList = points.toList(); final orgList = points.toList();
var rand = Random(userId.length); final rand = Random(userId.length);
for (int i = 0; i < points.length; i++) { for (var i = 0; i < points.length; i++) {
var orgDx = orgList[i].dx; final orgDx = orgList[i].dx;
var orgDy = orgList[i].dy; final orgDy = orgList[i].dy;
if (orgDx == 0 || if (orgDx == 0 ||
orgDy == 0 || orgDy == 0 ||
@@ -136,11 +144,11 @@ class DemoPainter extends CustomPainter {
continue; continue;
} }
int sign1 = rand.nextInt(2) == 1 ? 1 : -1; final sign1 = rand.nextInt(2) == 1 ? 1 : -1;
int sign2 = rand.nextInt(2) == 1 ? 1 : -1; final sign2 = rand.nextInt(2) == 1 ? 1 : -1;
double dx = 0.6 * sign1 * rand.nextInt(size.width ~/ columnCount); final dx = 0.6 * sign1 * rand.nextInt(size.width ~/ columnCount);
double dy = 0.6 * sign2 * rand.nextInt(size.height ~/ rowCount); final dy = 0.6 * sign2 * rand.nextInt(size.height ~/ rowCount);
transformedList.add(Offset(orgDx + dx, orgDy + dy)); transformedList.add(Offset(orgDx + dx, orgDy + dy));
} }
@@ -149,22 +157,51 @@ class DemoPainter extends CustomPainter {
} }
} }
/// Class for storing and drawing four points of a polygon
class Offset4 { class Offset4 {
/// Constructor for [Offset4]
Offset4(
this.p1,
this.p2,
this.p3,
this.p4,
this.row,
this.column,
this.rowSize,
this.colSize,
this.gradient,
);
/// Point 1
int p1; int p1;
/// Point 2
int p2; int p2;
/// Point 3
int p3; int p3;
/// Point 4
int p4; int p4;
/// Position of polygon on grid
int row; int row;
/// Position of polygon on grid
int column; int column;
/// Max row size
int rowSize; int rowSize;
/// Max col size
int colSize; int colSize;
/// Gradient to be applied to polygon
List<Color> gradient; List<Color> gradient;
Offset4(this.p1, this.p2, this.p3, this.p4, this.row, this.column, /// Draw the polygon on canvas
this.rowSize, this.colSize, this.gradient);
void draw(Canvas canvas, List<Offset> points) { void draw(Canvas canvas, List<Offset> points) {
Paint paint = Paint() final paint = Paint()
..color = Color.fromARGB(255, Random().nextInt(255), ..color = Color.fromARGB(255, Random().nextInt(255),
Random().nextInt(255), Random().nextInt(255)) Random().nextInt(255), Random().nextInt(255))
..shader = ui.Gradient.linear( ..shader = ui.Gradient.linear(
@@ -185,6 +222,7 @@ class Offset4 {
} }
} }
/// Gradient list for polygons
const colorGradients = [ const colorGradients = [
[Color(0xffffafbd), Color(0xffffc3a0)], [Color(0xffffafbd), Color(0xffffc3a0)],
[Color(0xff2193b0), Color(0xff6dd5ed)], [Color(0xff2193b0), Color(0xff6dd5ed)],