skip to Main Content
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

2

Answers


  1. 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,
          )
    
    Login or Signup to reply.
  2. 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,
    ),
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search