RichText 사용 Flutter: 가이드 및 예제

에는 단일 텍스트 위젯 내에서 다양한 스타일과 서식을 사용하여 텍스트를 생성할 수 있는 위젯이 있습니다 Flutter. RichText 여러 TextSpan 위젯을 사용하여 다양한 스타일로 텍스트의 다양한 부분을 정의할 수 있습니다.

사용 방법의 예는 다음과 같습니다 RichText.

import 'package:flutter/material.dart';  
  
void main() {  
  runApp(MyApp());  
}  
  
class MyApp extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    return MaterialApp(  
      home: MyHomePage(),  
   );  
  }  
}  
  
class MyHomePage extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
      appBar: AppBar(  
        title: Text('RichText Example'),  
     ),  
      body: Center(  
        child: RichText(  
          text: TextSpan(  
            text: 'Hello ',  
            style: DefaultTextStyle.of(context).style,  
            children: <TextSpan>[  
              TextSpan(  
                text: 'Flutter',  
                style: TextStyle(  
                  fontWeight: FontWeight.bold,  
                  color: Colors.blue,  
               ),  
             ),  
              TextSpan(text: ' is amazing!'),  
            ],  
         ),  
       ),  
     ),  
   );  
  }  
}  

이 예에서는 RichText 위젯을 사용하여 다양한 스타일의 텍스트를 생성합니다. 위젯 TextSpan 은 고유한 스타일로 텍스트의 다양한 부분을 정의하기 위해 하위 항목으로 사용됩니다.

• 첫 번째 TextSpan 스타일은 컨텍스트의 기본 텍스트 스타일을 사용하여 스타일이 지정됩니다(이 경우 의 기본 스타일을 상속함 AppBar).
• 두 번째는 TextSpan 단어 " Flutter "에 굵은 글꼴 두께와 파란색을 적용합니다.
• 세 번째는 TextSpan 단순히 "놀라워요!"라는 텍스트를 추가합니다. 끝까지.

필요에 따라 각각의 서식, 글꼴, 색상 및 기타 스타일을 사용자 정의할 수 있습니다 TextSpan.

위젯 RichText 은 서식이 지정된 콘텐츠를 표시하거나 특정 단어나 문구를 강조할 때와 같이 텍스트의 다양한 부분에 다양한 스타일을 적용해야 할 때 특히 유용합니다.

다양한 스타일과 중첩된 위젯을 자유롭게 실험하여 TextSpan 앱에서 원하는 시각적 효과를 얻으세요.