本文介绍了如何在Flutter中突出显示特定字母的文本?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在尝试突出显示两个特定的字母"Rs",例如%或!"的任何特殊字符.和1234等数字.
对于这个问题,我已经有一半的答案了-
您可以尝试以下操作:
import'package:flutter/material.dart';void main()=>runApp(MyApp());MyApp类扩展了StatelessWidget {@override窗口小部件build(BuildContext context){返回MaterialApp(标题:"Flutter演示",debugShowCheckedModeBanner:否,主题:ThemeData(primarySwatch:Colors.blue,),主页:MyHomePage(标题:"Flutter演示首页"),);}}类MyHomePage扩展了StatefulWidget {MyHomePage({Key key,this.title}):超级(key:key);最终的字符串标题;@override_MyHomePageState createState()=>_MyHomePageState();}类_MyHomePageState扩展State< MyHomePage>{字符串str =嘿,我是1234,%Rs10";int findLen(String word){返回word.replaceAll(new RegExp(r'[a-zA-Z]'),``'').length;}var styleOne = TextStyle(color:Colors.black87,fontSize:21);var styleTwo = TextStyle(color:Colors.black87,fontWeight:FontWeight.w800,fontSize:24);@override窗口小部件build(BuildContext context){返回脚手架(appBar:AppBar(标题:文本(widget.title),),正文:RichText(溢出:TextOverflow.ellipsis,textAlign:TextAlign.center,maxLines:4文字:TextSpan(孩子:str.split(").map((word)=> TextSpan(文字:单词+"",样式:findLen(word)== word.length ||word.substring(0,2).contains("Rs")?风格二:styleOne)).toList(),),),);}}
正在运行的演示: Codepen
I am trying to highlight two letters 'Rs' in specific, any special characters like '% or !' and numbers like 1234 etc.
I already have half my answer from this question - How to highlight text in Flutter?but i'm not sure how to edit it for letters as I am new to RegEx?
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String str = "Hey I'm 1234 and %";
int findLen(String word) {
return word.replaceAll(new RegExp(r'[a-zA-Z]'), "").length;
}
var styleOne = TextStyle(color: Colors.black87, fontSize: 21);
var styleTwo = TextStyle(
color: Colors.black87, fontWeight: FontWeight.w800, fontSize: 24);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: RichText(
overflow: TextOverflow.ellipsis,
textAlign: TextAlign.center,
maxLines: 4,
text: TextSpan(
children: str
.split(" ")
.map((word) => TextSpan(
text: word + " ",
style: findLen(word) != word.length ? styleOne : styleTwo))
.toList(),
),
),
);
}
}
解决方案
You can try something like this:
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String str = "Hey I'm 1234 and % Rs10";
int findLen(String word) {
return word.replaceAll(new RegExp(r'[a-zA-Z]'), "").length;
}
var styleOne = TextStyle(color: Colors.black87, fontSize: 21);
var styleTwo = TextStyle(
color: Colors.black87, fontWeight: FontWeight.w800, fontSize: 24);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: RichText(
overflow: TextOverflow.ellipsis,
textAlign: TextAlign.center,
maxLines: 4,
text: TextSpan(
children: str
.split(" ")
.map((word) => TextSpan(
text: word + " ",
style: findLen(word) == word.length ||
word.substring(0, 2).contains("Rs")
? styleTwo
: styleOne))
.toList(),
),
),
);
}
}
Working demo: Codepen
这篇关于如何在Flutter中突出显示特定字母的文本?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!