变态需求
flutter中再满足多行文本,文本内有多个样式,并且多个样式可触发事件的情况,将其中的一部分文本的下划线往下移
实现
使用RichText组件,主要是看中里面的WidgetSpan可以穿child为一个widget
实现源码
Dart
Expanded(
child: RichText(
text: TextSpan(
children: [
TextSpan(
text: MmStrings.confirmService,
style:
MmTextStyles.textRegular.copyWith(fontSize: 12.sp),
recognizer: TapGestureRecognizer()
..onTap = () {
context.read<MmSignUpBloc>().add(
SignAgreePrivacyChangeEvent(
!state.isAgreePrivacyPolicy,
),
);
},
),
WidgetSpan(
child: InkWell(
onTap: () {
MmWebUtils.launchWebUrl(
"${CommonConfig.instance.apiPreConfig.webUrl}${MmStrings.serviceAgreementUrl}",
);
},
child: Stack(
clipBehavior: Clip.none,
children: [
Text(
MmStrings.serviceAgreement,
style: MmTextStyles.agreementStyle.copyWith(
fontSize: 12.sp,
decoration: TextDecoration.none,
),
),
Positioned(
left: 0,
right: 0,
bottom: -2,
child: Container(height: 1,color: MmColors.colorAgreement,),)
],
),
),
),
TextSpan(
text: MmStrings.andThe,
style:
MmTextStyles.textRegular.copyWith(fontSize: 12.sp),
),
WidgetSpan(
child: InkWell(
onTap: () {
MmWebUtils.launchWebUrl(
"${CommonConfig.instance.apiPreConfig.webUrl}${MmStrings.privacyPolicyUrl}",
);
},
child: Stack(
clipBehavior: Clip.none,
children: [
Text(
MmStrings.privacyPolicy,
style: MmTextStyles.agreementStyle.copyWith(
fontSize: 12.sp,
decoration: TextDecoration.none,
),
),
Positioned(
left: 0,
right: 0,
bottom: -2,
child: Container(height: 1,color: MmColors.colorAgreement,),)
],
),
),
),
TextSpan(
text: ".",
style:
MmTextStyles.textRegular.copyWith(fontSize: 12.sp),
),
],
),
),
),