styled_widget 0.0.4

  • Readme
  • Changelog
  • Example
  • Installing
  • new33

Styled_widget #

This package requires Dart 2.6.0 or newer which implies a Flutter version supporting this Dart version. As of right now Flutter stable does not support these constraints

If you want to try it out, you can find the package here

Introduction #

Basic Example #

final styledWidget = (Widget child) => Styled.widget(child)
    .padding(all: 20)
    .backgroundColor(Colors.blue)
    .constraints(width: 100, height: 100)
    .borderRadius(all: 10)
    .elevation(10)
    .alignment(Alignment.center);

@override
Widget build(BuildContext context) => styledWidget(FlutterLogo());
Native Flutter equivilent
  Align(
    alignment: Alignment.center,
    child: DecoratedBox(
      decoration: BoxDecoration(
        boxShadow: [
          BoxShadow(
            color: Color(0x55000000),
            offset: Offset(0, 10),
            blurRadius: 10,
          ),
        ],
      ),
      child: ClipRRect(
        borderRadius: BorderRadius.circular(10),
        child: ConstrainedBox(
          constraints: BoxConstraints.tightFor(width: 100, height: 100),
          child: DecoratedBox(
            decoration: BoxDecoration(color: Colors.blue),
            child: Padding(
              padding: EdgeInsets.all(10),
              child: FlutterLogo(),
            ),
          ),
        ),
      ),
    ),
  ),

Result #

Example #

Text('some text')
  .textColor(Colors.white)
  .bold()
  .alignment(Alignment.center) // aligns text
  .constraints(width: 100, height: 100)
  .ripple()
  .backgroundColor(Colors.blue)
  .borderRadius(all: 10)
  .elevation(10)
  .alignment(Alignment.center), // aligns widget
Icon(Icons.portable_wifi_off)
  .iconColor(Colors.yellow)
  .iconSize(24)
  .padding(all: 30)
  .backgroundColor(Colors.amber),
Native Flutter equivilent
  Align(
    alignment: Alignment.center,
    child: ClipRRect(
      borderRadius: BorderRadius.circular(10),
      child: DecoratedBox(
        decoration: BoxDecoration(
          color: Colors.blue,
        ),
        child: ConstrainedBox(
          constraints: BoxConstraints.tightFor(width: 100, height: 100),
          child: Align(
            alignment: Alignment.center,
            child: Text(
              'some text',
              style: TextStyle(
                  fontWeight: FontWeight.bold, color: Colors.white),
            ),
          ),
        ),
      ),
    ),
  ),
  DecoratedBox(
    decoration: BoxDecoration(color: Colors.amber),
    child: Padding(
      padding: EdgeInsets.all(30),
      child: Icon(
        Icons.portable_wifi_off,
        size: 24,
        color: Colors.yellow,
      ),
    ),
  ),

Result #

Core Concepts #

Widget Tree #

Implicit Animations #

Contributing #

0.0.4 #

  • Added [linearGradient], [radialGradient], [sweepGradient], [backgroundBlendMode], [backgroundImage], [scrollable]
  • Merges similar widgets together
  • Minor improvements and fixes

0.0.3 #

  • Added animations for all [widget] methods supporting animations
  • Added more methods

0.0.2 #

  • Added more basic widgets
  • Added some animated widgets

0.0.1 #

  • Initial consept

example/README.md

Example #

Text('some text')
  .bold()
  .textColor(Colors.green)
  .alignment(Alignment.center)

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  styled_widget: ^0.0.4

2. Install it

You can install packages from the command line:

with pub:


$ pub get

with Flutter:


$ flutter pub get

Alternatively, your editor might support pub get or flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:styled_widget/styled_widget.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
43
Health:
Code health derived from static analysis. [more]
0
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
60
Overall:
Weighted score of the above. [more]
33
Learn more about scoring.

We analyzed this package on Dec 4, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.6.1
  • pana: 0.12.21
  • Flutter: 1.9.1+hotfix.6

Platforms

Detected platforms:

Error(s) prevent platform classification:

Make sure flutter format successfully runs on your package's source files.

Analysis issues and suggestions

Make sure flutter format successfully runs on your package's source files.

Running flutter format failed with the following output:

Exception: dartfmt on lib/ failed with exit code 65
Could not format because the source could not be parsed:

line 8, column 1 of lib/src/text.dart: This requires the 'extension-methods' experiment to be enabled.
  ╷
8 │ extension StyledText on Text {
  │ ^^^^^^^^^
  ╵
line 8, column 25 of lib/src/text.dart: Functions must have an explicit list of parameters.
  ╷

Fix dependencies in pubspec.yaml.

Running flutter pub upgrade failed with the following output:

ERR: The current Dart SDK version is 2.5.0.
 
 Because styled_widget requires SDK version >=2.6.0 <3.0.0, version solving failed.

Maintenance issues and suggestions

Fix platform conflicts. (-20 points)

Error(s) prevent platform classification:

Make sure flutter format successfully runs on your package's source files.

Make sure dartdoc successfully runs on your package's source files. (-10 points)

Dependencies were not resolved.

Package is pre-v0.1 release. (-10 points)

While nothing is inherently wrong with versions of 0.0.*, it might mean that the author is still experimenting with the general direction of the API.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.6.0 <3.0.0