如何在 flutter 中為選定的文本添加下划線

Question

我如何在 flutter 中實現這樣的東西

Answer 1

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class HomePage extends StatefulWidget {
  @override
  _HomePage createState() => _HomePage();
}

class _HomePage extends State<HomePage> {
  var text = 'test';
  bool isSelect= false;

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: Column(
          children: [
            GestureDetector(
                onTap: (){
                  if(isSelect == false){
                    setState(() {
                      isSelect= true;
                    });
                  }else{
                    setState(() {
                      isSelect = false;
                    });
                  }
                },
                child: isSelect == false ? Center(child: Text(text,style: const TextStyle(fontSize: 50,fontWeight: FontWeight.bold),)): isSelect == true ? Center(child: Text(text,style: const TextStyle(decoration: TextDecoration.underline,fontSize: 50,fontWeight: FontWeight.bold,color: Colors.red),)):Text('')),
          ],
        ),
      ),
    );
  }
}