链接文本以改变屏幕颤动答案

【问题标题】：Linked text to change screen flutter链接文本以改变屏幕颤动
【发布时间】：2021-05-26 13:45:36
【问题描述】：

我需要在附加图像中突出显示“创建帐户”文本，因此我使用了“TapGestureRecognizer”。但是，我找不到在点击“创建帐户”时更改屏幕的方法。请有人告诉我如何使用“TapGestureRecognizer”来更改屏幕，或者我可以使用任何其他首选解决方案来实现相同的目标。

enter image description here

  margin: const EdgeInsets.only(top: 25.0),
  child: RichText(
    text: TextSpan(
        children: [
          TextSpan(
              text: ‘I do not have an account’,
              style: TextStyle(color: Colors.black87)
          ),
          TextSpan(
              text: ' Create account’,
              style: new TextStyle(color: Color.fromRGBO(24, 44, 228, 1)),
              recognizer: new TapGestureRecognizer(
              )
          ),
        ]
    ),
  ),
)

class CreateAccount extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text('Create account'),
      ),
    );
    throw UnimplementedError();
  }
}

【问题讨论】：

标签： flutter

【解决方案1】：

我在 dartpad.dev 中测试了下面的代码，它运行良好。
你会检查其他代码还是让我知道结构？

import 'package:flutter/material.dart';
import 'package:flutter/gestures.dart';
final Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return RichText(
    text: TextSpan(
        children: [
          TextSpan(
              text: 'I do not have an account',
              style: TextStyle(color: Colors.black87)
          ),
          TextSpan(
              text: ' Create account',
              style: new TextStyle(color: Color.fromRGBO(24, 44, 228, 1)),
              recognizer: TapGestureRecognizer()
                  ..onTap = () {
                    Navigator.push(
                      context,
                      MaterialPageRoute(
                        builder: (context) => CreateAccount()),
              );
            }
          ),
        ]
    ),
    );
  }
}



class CreateAccount extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Create account'),
      ),
    );
    throw UnimplementedError();
  }
}

【讨论】：

我试过了，没有错误，但是屏幕没有改变onTap
@IfeoluwaWole-Osho 我测试了我更新的整个测试代码。我确认发生了页面更改。

【解决方案2】：

您可以简单地用 InkWell 小部件包装 TextSpan 小部件，而不是使用 TapGestureRecognizer，并且在 onTap 方法中，您可以编写代码以导航到另一个屏幕。

        InkWell(
          child: TextSpan(...),
          onTap: () {
            // Your logic here
          },
        )

【讨论】：