带有嵌入式按钮的 Flutter 文本小部件

Question

我正在制作一个登录屏幕。我想要文本:“通过继续，您同意 xxx 条款和条件以及隐私政策”，其中 - 条款和条件 - 和 - 隐私政策 - 是按钮，点击这些按钮后，导航到两个单独的屏幕。

这在 Flutter 中可能吗？请注意，由于最终文本字符串的长度，它可能会换行，具体取决于屏幕大小。

非常感谢对此的任何帮助。

卡森

Answer 1

你可以用 RichText 做到这一点

像这样

class DoItWithRichText extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Center(
          child: RichText(
            text: TextSpan(
              text: "By continuing you agree the",
              children:[
                TextSpan(
                  text: " Terms and Conditions",
                  style: TextStyle(
                    color: Colors.blue
                  ),
                  recognizer: TapGestureRecognizer()..onTap = () => Navigator.of(context).push(MaterialPageRoute(builder: (context) => TermsAndConditions()))
                ),
                TextSpan(
                  text: " and "
                ),
                TextSpan(
                  text: "Privacy Policy",
                  style: TextStyle(
                    color: Colors.blue
                  ),
                    recognizer: TapGestureRecognizer()..onTap = () => Navigator.of(context).push(MaterialPageRoute(builder: (context) => PrivacyAndPolicy()))
                )
              ],
              style: TextStyle(
                color: Colors.black,
                fontSize: 13
              )
            ),

          ),
        ),
      ),
    );
  }
}