Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add custom direction #80

Merged
merged 6 commits into from
Apr 9, 2024
Merged

Add custom direction #80

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
b60f425
Add custom direction
adsonpleal Mar 19, 2024
da63656
Improve UI and add tests
adsonpleal Mar 25, 2024
2b2bddf
Move tests and add end and aligment tests
adsonpleal Mar 25, 2024
a0eaac6
PR requested changes
adsonpleal Mar 27, 2024
f725587
revert wrong commited changes
adsonpleal Mar 27, 2024
e6f4bdc
requested changes
adsonpleal Apr 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ Flutter Gradient Generator is a web app that generates linear, radial and sweep
- bottom-left
- bottom-center
- bottom-right
- custom

4. **Choose the gradient colors.**

Expand Down
5 changes: 5 additions & 0 deletions lib/data/app_strings.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ class AppStrings {
static const colors = 'Colors';
static const colorsAndStops = 'Colors & Stops';
static const random = 'Random';
static const custom = 'Custom';
static const direction = 'Direction';
static const tapToEdit = 'Tap to edit';
static const enterInPercentage = 'Enter in %';
Expand All @@ -25,6 +26,10 @@ class AppStrings {
static const giveFeedback = 'Give Feedback';
static const viewSourceCodeOnGitHub = 'View Source Code On GitHub';
static const downloadGradientAsImage = 'Download Gradient As Image';
static const alignmentX = 'X:';
static const alignmentY = 'Y:';
static const alignment = 'Alignment:';
static const endAlignment = 'End Alignment:';

/// URLs
static const githubUrl =
Expand Down
92 changes: 82 additions & 10 deletions lib/enums/gradient_direction.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,83 @@
enum GradientDirection {
topLeft,
topCenter,
topRight,
centerLeft,
center,
centerRight,
bottomLeft,
bottomCenter,
bottomRight
import 'package:flutter/material.dart';

sealed class GradientDirection {
const GradientDirection();

static const topLeft = GradientDirectionTopLeft._();
static const topCenter = GradientDirectionTopCenter._();
static const topRight = GradientDirectionTopRight._();
static const centerLeft = GradientDirectionCenterLeft._();
static const center = GradientDirectionCenter._();
static const centerRight = GradientDirectionCenterRight._();
static const bottomLeft = GradientDirectionBottomLeft._();
static const bottomCenter = GradientDirectionBottomCenter._();
static const bottomRight = GradientDirectionBottomRight._();

factory GradientDirection.custom({
Alignment alignment = const Alignment(-0.5, 0),
Alignment endAlignment = const Alignment(0.5, 0),
}) {
return GradientDirectionCustom._(
alignment: alignment,
endAlignment: endAlignment,
);
}
victoreronmosele marked this conversation as resolved.
Show resolved Hide resolved
}

class GradientDirectionTopLeft extends GradientDirection {
const GradientDirectionTopLeft._();
}

class GradientDirectionTopCenter extends GradientDirection {
const GradientDirectionTopCenter._();
}

class GradientDirectionTopRight extends GradientDirection {
const GradientDirectionTopRight._();
}

class GradientDirectionCenterLeft extends GradientDirection {
const GradientDirectionCenterLeft._();
}

class GradientDirectionCenter extends GradientDirection {
const GradientDirectionCenter._();
}

class GradientDirectionCenterRight extends GradientDirection {
const GradientDirectionCenterRight._();
}

class GradientDirectionBottomLeft extends GradientDirection {
const GradientDirectionBottomLeft._();
}

class GradientDirectionBottomCenter extends GradientDirection {
const GradientDirectionBottomCenter._();
}

class GradientDirectionBottomRight extends GradientDirection {
const GradientDirectionBottomRight._();
}

class GradientDirectionCustom extends GradientDirection {
const GradientDirectionCustom._({
required this.alignment,
required this.endAlignment,
});

final Alignment alignment;
final Alignment endAlignment;

@override
bool operator ==(Object other) {
if (identical(this, other)) return true;

return other is GradientDirectionCustom &&
other.alignment == alignment &&
other.endAlignment == endAlignment;
}

@override
int get hashCode => alignment.hashCode ^ endAlignment.hashCode;
}
93 changes: 25 additions & 68 deletions lib/models/linear_style_gradient.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,76 +24,33 @@ class LinearStyleGradient extends AbstractGradient {
''';

@visibleForTesting
Alignment get beginAlignment {
Alignment alignment;
switch (getGradientDirection()) {
case GradientDirection.topLeft:
alignment = Alignment.topLeft;
break;
case GradientDirection.topCenter:
alignment = Alignment.topCenter;
break;
case GradientDirection.topRight:
alignment = Alignment.topRight;
break;
case GradientDirection.centerLeft:
alignment = Alignment.centerLeft;
break;
case GradientDirection.center:
alignment = Alignment.center;
break;
case GradientDirection.centerRight:
alignment = Alignment.centerRight;
break;
case GradientDirection.bottomLeft:
alignment = Alignment.bottomLeft;
break;
case GradientDirection.bottomCenter:
alignment = Alignment.bottomCenter;
break;
case GradientDirection.bottomRight:
alignment = Alignment.bottomRight;
break;
}

return alignment;
}
Alignment get beginAlignment => switch (getGradientDirection()) {
GradientDirectionTopLeft() => Alignment.topLeft,
GradientDirectionTopCenter() => Alignment.topCenter,
GradientDirectionTopRight() => Alignment.topRight,
GradientDirectionCenterLeft() => Alignment.centerLeft,
GradientDirectionCenter() => Alignment.center,
GradientDirectionCenterRight() => Alignment.centerRight,
GradientDirectionBottomLeft() => Alignment.bottomLeft,
GradientDirectionBottomCenter() => Alignment.bottomCenter,
GradientDirectionBottomRight() => Alignment.bottomRight,
GradientDirectionCustom(alignment: final alignment) => alignment,
};

@visibleForTesting
Alignment get endAlignment {
Alignment alignment;

switch (getGradientDirection()) {
case GradientDirection.topLeft:
alignment = Alignment.bottomRight;
break;
case GradientDirection.topCenter:
alignment = Alignment.bottomCenter;
break;
case GradientDirection.topRight:
alignment = Alignment.bottomLeft;
break;
case GradientDirection.centerLeft:
alignment = Alignment.centerRight;
break;
case GradientDirection.center:
alignment = Alignment.center;
break;
case GradientDirection.centerRight:
alignment = Alignment.centerLeft;
break;
case GradientDirection.bottomLeft:
alignment = Alignment.topRight;
break;
case GradientDirection.bottomCenter:
alignment = Alignment.topCenter;
break;
case GradientDirection.bottomRight:
alignment = Alignment.topLeft;
break;
}
return alignment;
}
Alignment get endAlignment => switch (getGradientDirection()) {
GradientDirectionTopLeft() => Alignment.bottomRight,
GradientDirectionTopCenter() => Alignment.bottomCenter,
GradientDirectionTopRight() => Alignment.bottomLeft,
GradientDirectionCenterLeft() => Alignment.centerRight,
GradientDirectionCenter() => Alignment.center,
GradientDirectionCenterRight() => Alignment.centerLeft,
GradientDirectionBottomLeft() => Alignment.topRight,
GradientDirectionBottomCenter() => Alignment.topCenter,
GradientDirectionBottomRight() => Alignment.topLeft,
GradientDirectionCustom(endAlignment: final endAlignment) =>
endAlignment,
};

@override
String toWidgetString() {
Expand Down
45 changes: 12 additions & 33 deletions lib/models/radial_style_gradient.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,39 +24,18 @@ class RadialStyleGradient extends AbstractGradient {

@visibleForTesting
Alignment get centerAlignment {
Alignment alignment;

switch (getGradientDirection()) {
case GradientDirection.topLeft:
alignment = Alignment.topLeft;
break;
case GradientDirection.topCenter:
alignment = Alignment.topCenter;
break;
case GradientDirection.topRight:
alignment = Alignment.topRight;
break;
case GradientDirection.centerLeft:
alignment = Alignment.centerLeft;
break;
case GradientDirection.center:
alignment = Alignment.center;
break;
case GradientDirection.centerRight:
alignment = Alignment.centerRight;
break;
case GradientDirection.bottomLeft:
alignment = Alignment.bottomLeft;
break;
case GradientDirection.bottomCenter:
alignment = Alignment.bottomCenter;
break;
case GradientDirection.bottomRight:
alignment = Alignment.bottomRight;
break;
}

return alignment;
return switch (getGradientDirection()) {
GradientDirectionTopLeft() => Alignment.topLeft,
GradientDirectionTopCenter() => Alignment.topCenter,
GradientDirectionTopRight() => Alignment.topRight,
GradientDirectionCenterLeft() => Alignment.centerLeft,
GradientDirectionCenter() => Alignment.center,
GradientDirectionCenterRight() => Alignment.centerRight,
GradientDirectionBottomLeft() => Alignment.bottomLeft,
GradientDirectionBottomCenter() => Alignment.bottomCenter,
GradientDirectionBottomRight() => Alignment.bottomRight,
GradientDirectionCustom(alignment: final alignment) => alignment,
};
}

@override
Expand Down
45 changes: 12 additions & 33 deletions lib/models/sweep_style_gradient.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,39 +24,18 @@ class SweepStyleGradient extends AbstractGradient {

@visibleForTesting
Alignment get centerAlignment {
Alignment alignment;

switch (getGradientDirection()) {
case GradientDirection.topLeft:
alignment = Alignment.topLeft;
break;
case GradientDirection.topCenter:
alignment = Alignment.topCenter;
break;
case GradientDirection.topRight:
alignment = Alignment.topRight;
break;
case GradientDirection.centerLeft:
alignment = Alignment.centerLeft;
break;
case GradientDirection.center:
alignment = Alignment.center;
break;
case GradientDirection.centerRight:
alignment = Alignment.centerRight;
break;
case GradientDirection.bottomLeft:
alignment = Alignment.bottomLeft;
break;
case GradientDirection.bottomCenter:
alignment = Alignment.bottomCenter;
break;
case GradientDirection.bottomRight:
alignment = Alignment.bottomRight;
break;
}

return alignment;
return switch (getGradientDirection()) {
GradientDirectionTopLeft() => Alignment.topLeft,
GradientDirectionTopCenter() => Alignment.topCenter,
GradientDirectionTopRight() => Alignment.topRight,
GradientDirectionCenterLeft() => Alignment.centerLeft,
GradientDirectionCenter() => Alignment.center,
GradientDirectionCenterRight() => Alignment.centerRight,
GradientDirectionBottomLeft() => Alignment.bottomLeft,
GradientDirectionBottomCenter() => Alignment.bottomCenter,
GradientDirectionBottomRight() => Alignment.bottomRight,
GradientDirectionCustom(alignment: final alignment) => alignment,
};
}

@override
Expand Down
Loading