bootstrap_typography2 1.0.1

Bootstrap typography, size text based on screen size, uses bootstrap values in pixels

Bootstrap Typography

A Flutter package that make creating responsive Bootstrap like text easier.

Importing:

YAML:

dependencies:
  bootstrap_typography2: ^1.0.0

Dart:

import 'package:bootstrap_typography2/bootstrap_typography2.dart';

Example:

Simple Examples:

P(BSTextParams("Hello World!"));

H1(
  BSTextParams(
      "Picture",
      weight: FontWeight.bold,
      textAlignment: TextAlign.center,
    ),
);

Full and Fun Example:

included in pkg under example/full_and_fun_example.dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bootstrap/flutter_bootstrap.dart';
import 'package:bootstrap_typography2/bootstrap_typography2.dart';

void main() {
runApp(
  MaterialApp(
    debugShowCheckedModeBanner: false,
    home: SafeArea(
      child: Scaffold(
        body: Builder(
          builder: (BuildContext context) {
            return BootstrapContainer(
              children: [
                BootstrapRow(
                  children: [
                    BootstrapCol(
                      sizes: "col-12",
                      child: H1(
                        BSTextParams(
                          "Hello World!",
                          textAlignment: TextAlign.center,
                          weight: FontWeight.bold,
                          color: Colors.pink,
                        ),
                      ),
                    ),
                  ],
                ),
                BootstrapRow(
                  children: [
                    BootstrapCol(
                      sizes: "col-12 col-sm-12 col-md-6",
                      child: H1(
                        BSTextParams(
                          "Left",
                          textAlignment: bootStrapValueBasedOnSize(sizes: {
                            "": TextAlign.center,
                            "sm": TextAlign.center,
                            "md": TextAlign.left,
                            "lg": TextAlign.left,
                            "xl": TextAlign.left,
                          }, context: context),
                          textDecoration: TextDecoration.underline,
                          color: Colors.blue,
                        ),
                      ),
                    ),
                    BootstrapCol(
                      sizes: "col-12 col-sm-12 col-md-6",
                      child: H1(
                        BSTextParams(
                          "Right",
                          textAlignment: bootStrapValueBasedOnSize(sizes: {
                            "": TextAlign.center,
                            "sm": TextAlign.center,
                            "md": TextAlign.right,
                            "lg": TextAlign.right,
                            "xl": TextAlign.right,
                          }, context: context),
                          fontStyle: FontStyle.italic,
                          color: Colors.green,
                        ),
                      ),
                    ),
                  ],
                ),
              ],
            );
          },
        ),
      ),
    ),
  ),
);
}

Supports:

• p = P(BSTextParams),
• h1 = H1(BSTextParams),
• h2 = H2(BSTextParams),
• h3 = H3(BSTextParams),
• h4 = H4(BSTextParams),
• h5 = H5(BSTextParams),
• h6 = H6(BSTextParams),

Can Set Text Parametes Using BSTextParams:

• text
• textAlignment,
• color,
• weight,
• fontStyle,
• textDecoration,
• height,
• background,
• backgroundColor,
• decorationColor,
• decorationStyle,
• decorationThickness,
• fontFamily,
• fontFamilyFallback,
• fontFeatures,
• debugLabel,
• foreground,
• inherit,
• leadingDistribution,
• letterSpacing,
• locale,
• overflow,
• package,
• shadows,
• textBaseline,
• wordSpacing,
• maxLines,
• semanticsLabel,
• softWrap,
• strutStyle,
• textDirection,
• textHeightBehavior,
• textScaleFactor,
• textWidthBasis,

Text Sizes:

Small falls under screen sizes that are defined by flutter_bootstrap using bootStrapValueBasedOnSize for

• '',
• 'sm'

Large falls under screen sizes that are defined by flutter_bootstrap using bootStrapValueBasedOnSize for

• 'md',
• 'lg',
• 'xl'

Sizes in px:

• p 16px,
• h1 40px,
• h1 small 32px,
• h2 32px,
• h2 small 25px,
• h3 28px,
• h3 small 22px
• h4 24px,
• h4 small 24px,
• h5 20px,
• h5 small 16px,
• h6 16px,
• h6 small 13px

Ref

• https://bootstrapcreative.com/bootstrap-text-sizes/ https://pub.dev/packages/flutter_bootstrap
• https://www.didierboelens.com/2020/05/responsive-bootstrap-like-solution/