🙋♂️ I'm an IconToo
!
An extended Icon
"too" for those that are not actually square, plus 👥 shadows
support.
WORK IN PROGRESS
+ 🗜️
extension IconUtils on Icon
... because Flutter's native Icon
"assumes that the rendered icon is squared" and that "non-squared icons may render incorrectly."
const IconToo(IconData icon, {Key? key, 🕳️, double? sizeX, double? sizeY,
Color? color, List<Shadow>? shadows, AlignmentGeometry? alignment,
String? semanticLabel, TextDirection? textDirection})
🕳️
Deprecated. Adopt
double
ssizeX
andsizeY
.
Size? trueSize
Builds an Icon
-akin widget set inside a SizedBox
constrained by sizeX
and sizeY
with given icon
data.
Customize with 🎨 color
, which defaults to IconTheme.of
, or optional 👥 shadows
, a List<Shadow>
like TextStyle.shadows
.
The AlignmentGeometry
and textDirection
are handled, but may be overridden if necessary.
- See
alignment
for more information.
Replete with proper Semantics
and debug Property
s.
NOTE: All the boxes are checked as far as the parameters for which a standard
Icon
looks and the accessibility & debug features they offer.As a design choice, the
super
Icon
receivesthis
IconToo
's initializedsizeX ?? sizeY
, if any, asIcon.size
.
- This assignment behavior can be reversed to
sizeY ?? sizeX
by using theIconToo.tall
constructor.SEE ALSO:
Icon
, for a description on what an "Icon
" is and some requirements to deploy thatWidget
or an 🙋♂️IconToo
.
❓ IconToo
as IconButton
:
final wideButton = IconButton(
icon: const IconToo(
CustomIcons.non_square_icon,
// IconToo passes `fontSize: min(trueSize.width, trueSize.height)`,
// the shortest side (here: height), to glyph-rendering TextStyle:
sizeX: 34.0 * 5.0, // Glyph is 5 times wider than tall
sizeY: 34.0,
),
// But the max(), or longest side, is needed to ensure an
// IconButton has a diameter that encompasses the entire IconToo:
iconSize: 34.0 * 5.0, // IconToo.asSize.longestSize
onPressed: () {},
);
❓ Example App
See some example usage of the icon
package:
- Icon Example Android source:
/example/lib/main.dart
- Icon Example APK
🗜️ Icon Utilities
Icon Example - Demo 3: 🗜️ Icon
Operator
Utilities: /example/lib/demo3.dart
- 📋
copyWith
optional replacement values - 👆
operator >(VoidCallback onTap)
➡IconButton
- ➕
operator +(inflate)
➡size += inflation
- ➖
operator -(deflate)
➡size -= deflation
- ❌
operator *(dynamic operation)
- ❓
operation is Color
➡color = operation
- ❓
operation is double
➡size *= operation
- ❓
- 🧦
operator &(dynamic padding)
- ❓
padding is num
➡EdgeInsets.all(padding)
- ❓
padding is List<num>
(length==2) ➡EdgeInsets.symmetric(horizontal: padding[0], vertical: padding[1])
- ❓
padding is List<num>
(length==4) ➡EdgeInsets.fromLTRB(padding[0], padding[1],padding[2], padding[3])
- ❓
🗜️ IconToo Utilities
Icon Example - Demo 3: 🗜️ Icon
Operator
Utilities: /example/lib/demo3.dart
- 📋
copyWith
optional replacement values - 👆
operator >(VoidCallback onTap)
➡IconButton
- ➕
operator +(inflate)
➡sizeX += inflation
&sizeY += inflation
- ❓
inflation is num
: adds tosizeX
&sizeY
the same - ❓
inflation is List<num>
(length==2): rampsX += inflation[0]
&Y += inflation[1]
- ❓
- ➖
operator -(deflate)
➡sizeX -= deflation
&sizeY -= deflation
- ❓
deflation is num
: subtracts fromsizeX
&sizeY
the same - ❓
deflation is List<num>
(length==2): rampsX -= deflation[0]
&Y -= deflation[1]
- ❓
- ❌
operator *(dynamic operation)
- ❓
operation is Color
➡color = operation
- ❓
operation is num
: multipliessizeX
&sizeY
the same - ❓
operation is List<num>
(length==2): rampsX *= operation[0]
&Y *=operation[1]
- ❓
- 🧦
operator &(dynamic padding)
- ❓
padding is num
➡EdgeInsets.all(padding)
- ❓
padding is List<num>
(length==2) ➡EdgeInsets.symmetric(horizontal: padding[0], vertical: padding[1])
- ❓
padding is List<num>
(length==4) ➡EdgeInsets.fromLTRB(padding[0], padding[1],padding[2], padding[3])
- ❓
Nearly every IconToo
operator
works the same in IconUtils
as well.
The only differences (currently) are IconToo.+
, IconToo.-
, IconToo.*
, all of which additionally (over IconUtils
)
accept a List<num>
of length==2
where the first value applies to IconToo.sizeX
and the second value to IconToo.sizeY
.
Libraries
- icon
- 🙋♂️ I'm an Icon Too!