Home > Mobile >  How to add textstyle in global class using flutter
How to add textstyle in global class using flutter

Time:12-27

class CATextStyle extends TextStyle {
   static const  style = TextStyle();
  //const CATextStyle._(TextStyle style) : super(style);
  CATextStyle._style(TextStyle style) : super(style);
}

abstract class CATextStyles {
  static const _parent = TextStyle();
  static final headLine1 =
      CATextStyle._style(_parent.copyWith(color: Colors.amber));
}

I want to created class like this but is showing error

i want to know how to use only one textstyle class and reuse that using copywith method

CodePudding user response:

Here is how I do this, Create a separate Directory and name it Constants and inside this create a dart file with the name appstyles.dart. In this class declare all your styles just like the below code.

class AppStyles{

static  TextStyle headline1 = TextStyle(
    fontFamily: 'Roboto',
    fontWeight: FontWeight.w300,
    fontSize: 40,
  );

 static const TextStyle headline2 = TextStyle(
    fontWeight: FontWeight.w400,
    fontSize: 30,
  );

 static const TextStyle bodyText1 = TextStyle(
    fontWeight: FontWeight.w300,
    color: Colors.black,
    fontSize: 16,
  );

static const TextStyle bodyText2 = TextStyle(
    color: Colors.black,
    fontWeight: FontWeight.w300,
    fontSize: 14,
  );
}

The same is you use for Container decoration etc e.g

static final kRoundedTContainer = BoxDecoration(
    color: Colors.red,
      borderRadius: BorderRadius.all(
        Radius.circular(10),
      ));

And here is how to use these styles

Text(
       'Hello World',
       style: AppStyles.headline1,
)

Container(
        decoration: AppStyles.kRoundedTContainer,
        height: 200,
        width: 200,
      )

CodePudding user response:

You can create TextStyle global class like this.

class CommonFontStyle {
    static font12WithRegular({color}) {
    return TextStyle(
        fontSize: Dimensions.fontSize12,
        fontFamily: 'Montserrat Regular',
        fontWeight: FontWeight.w500,
        color: color);
  }

  static font12WithMedium({weight}) {
    return TextStyle(
      fontSize: Dimensions.fontSize12,
      fontFamily: 'Montserrat Medium',
      fontWeight: weight,
    );
  }
}

and for use of this you have to add simply this font12WithRegular() to your textStyles.

 child: Text(
        "Okay",
         style: CommonFontStyle.font12WithRegular(),
         textAlign: TextAlign.center,
),
  • Related