서식이 다른 텍스트 줄을 어떻게 만들 수 있습니까?
예 :
Hello World
답변:
RichText 위젯을 사용해야합니다 .
RichText 위젯은 자식 TextSpan 목록도 포함 할 수 있는 TextSpan 위젯을받습니다.
각 TextSpan 위젯은 다른 TextStyle을 가질 수 있습니다 .
다음은 렌더링 할 예제 코드입니다. Hello World
var text = new RichText(
text: new TextSpan(
// Note: Styles for TextSpans must be explicitly defined.
// Child text spans will inherit styles from parent
style: new TextStyle(
fontSize: 14.0,
color: Colors.black,
),
children: <TextSpan>[
new TextSpan(text: 'Hello'),
new TextSpan(text: 'World', style: new TextStyle(fontWeight: FontWeight.bold)),
],
),
);
아래 답변은 단락이 아닌 두 단어에 가장 적합합니다. 긴 문장이나 특정 텍스트의 서식을 지정해야하는 단락이있는 경우 위의 답변에서 @DvdWasibi가 제안한대로 RichText 사용을 선호합니다.
나는 내 코드를 짧고 깔끔하게 유지하는 것을 좋아합니다. 이것은 Normal 글꼴과 다른 굵은 글씨 로 행에 두 개의 텍스트 필드를 추가하는 방법입니다 .
참고 : 긴 단락에서는 좋지 않을 수 있습니다. 헤드 라인 등에 적합합니다.
Row(children: <Widget>[
Text("Hello"),
Text("World", style: TextStyle(fontWeight: FontWeight.bold))
])
`
원하는 출력을 "Hello World " 로 얻어야합니다.
return RichText(
text: TextSpan(
text: 'Can you ',
style: TextStyle(color: Colors.black),
children: <TextSpan>[
TextSpan(
text: 'find the',
style: TextStyle(
color: Colors.green,
decoration: TextDecoration.underline,
decorationStyle: TextDecorationStyle.wavy,
),
recognizer: _longPressRecognizer,
),
TextSpan(text: 'secret?'),
],
),
);