728x90
여러 텍스트 스타일을 미리 저장해두고,
import 'package:culture_app/constant_color.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
// ...을 알려주세요
TextStyle kGrade1 = TextStyle(
fontSize: 30.sp,
color: kBlackColor,
fontWeight: FontWeight.w700,
height: 1.2,
);
// ...을 알려주세요
TextStyle kHeadline1 = TextStyle(
fontSize: 24.sp,
color: kBlackColor,
fontWeight: FontWeight.w700,
height: 1.5,
);
//
TextStyle kHeadline2 = TextStyle(
fontSize: 22.sp,
color: kBlackColor,
fontWeight: FontWeight.w500,
height: 1.5,
);
TextStyle kHeadline3 = TextStyle(
fontSize: 20.sp,
fontWeight: FontWeight.w500,
height: 2,
);
//
TextStyle kHeadline4 = TextStyle(
fontSize: 18.sp,
fontWeight: FontWeight.w500,
height: 2,
);
// 로그인을 하면 , 아이콘 텍스트
TextStyle kBody1 = TextStyle(
fontSize: 16.sp,
color: kBlackColor,
fontWeight: FontWeight.w500,
height: 1.5,
);
// 카카오계정으로 로그인 ...
TextStyle kBody2 = TextStyle(
fontSize: 14.sp,
fontWeight: FontWeight.w700,
height: 1.5,
);
// 텍스트 버튼
TextStyle kBody3 = TextStyle(
fontSize: 14.sp,
fontWeight: FontWeight.w500,
height: 1.5,
);
// 텍스트 버튼
TextStyle kBody4 = TextStyle(
fontSize: 12.sp,
fontWeight: FontWeight.w500,
height: 1.5,
);
TextStyle kBody5 = TextStyle(
fontSize: 10.sp,
fontWeight: FontWeight.w500,
height: 1.5,
);
TextStyle kBody6 = TextStyle(
fontSize: 8.sp,
fontWeight: FontWeight.w700,
height: 1.0,
);
// 폼 텍스트
// 힌트
TextStyle kHint1 = TextStyle(
fontSize: 20.sp,
fontWeight: FontWeight.w500,
color: const Color(0xffAFB7BF),
height: 1.8,
);
// 힌트
TextStyle kHint2 = TextStyle(
fontSize: 14.sp,
color: const Color(0xffAFB7BF),
height: 1.8,
);
// 라벨
TextStyle kLabel1 = TextStyle(
fontSize: 12.sp,
fontWeight: FontWeight.w500,
color: const Color(0xff8A929E),
);
// 텍스트
TextStyle kText1 = TextStyle(
fontSize: 20.sp,
fontWeight: FontWeight.w500,
color: kBlackColor,
);
// 에러
TextStyle kError1 = TextStyle(
fontSize: 12.sp,
fontWeight: FontWeight.w500,
color: kSystemErrorColor,
);
// 로그인을 하면 , 아이콘 텍스트
TextStyle kNextButton1 = TextStyle(
fontSize: 16.sp,
fontWeight: FontWeight.w400,
height: 1.5,
);
아래와 같이 copyWith() 함수를 사용해 변경할 부분만 변경하면 텍스트 스타일을 쉽게 사용 가능하다.
Text(
'${widget.festivalModel!.SRCHWRD_NM}\n영상으로\n체험하기',
textAlign: TextAlign.center,
style: kBody1.copyWith(
height: 1.0,
// color: kPapsText,
),
),
'개발 > Flutter' 카테고리의 다른 글
Flutter :: Riverpod / GoRouter / state, provider, notifier 선언 / 페이징 / http (0) | 2023.08.14 |
---|---|
Flutter :: Color 저장해서 변수로 재사용하기 (0) | 2023.08.14 |
Flutter :: API 통신 모듈화하기 / Dio helper / JWT token / cache interceptor (0) | 2023.01.31 |
Flutter :: 앱 아이콘(app_icon.png) 설정하기 (4) | 2023.01.26 |
Flutter 츠누봇 [Pull Request] :: [학식] 페이지 UI 퍼블리싱 (2) | 2022.12.07 |