Flutter - if Textbutton ontap to activate TextButton-CodePudding

My Problem I want search record page

i want funtion

I made a search bar with TextField,

I hope the ontap function in the TextField works as well as the launcher TextButton.

Code

TextField(
  onTap: () {},
  decoration: InputDecoration(
  hintText: "Please Input Data",
  hintStyle: TextStyle(
    fontFamily: 'Source Han Sans KR',
    fontSize: 14,
    color: const Color(0xffbcbcbc),
    letterSpacing: -0.35000000000000003,
    fontWeight: FontWeight.w300,
  ),
  border: InputBorder.none,
  prefixIcon: Icon(Icons.search)),
),

TextButton(
onPressed: () {
  
},
child: Text(
  'Activate',
  style: TextStyle(
    fontFamily: 'Source Han Sans KR',
    fontSize: 16,
    color: const Color(0xff191919),
    letterSpacing: -0.4,
  ),
  softWrap: false,
))

CodePudding user response：

In this code if textField have some data the button will be active.

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final textController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Row(
          children: [
            Expanded(
              child: TextField(
                onChanged: (value) {
                  setState(() {});
                },
                controller: textController,
                decoration: InputDecoration(
                    hintText: "Please Input Data",
                    hintStyle: TextStyle(
                      fontFamily: 'Source Han Sans KR',
                      fontSize: 14,
                      color: Color(0xffbcbcbc),
                      letterSpacing: -0.35000000000000003,
                      fontWeight: FontWeight.w300,
                    ),
                    border: InputBorder.none,
                    prefixIcon: Icon(Icons.search)),
              ),
            ),
            TextButton(
              onPressed: textController.text.isEmpty
                  ? null
                  : () {
                      // your code here
                    },
              child: Text(
                'Activate',
                style: TextStyle(
                  fontFamily: 'Source Han Sans KR',
                  fontSize: 16,
                  color: textController.text.isEmpty ? Colors.grey : Color(0xff191919),
                  letterSpacing: -0.4,
                ),
                softWrap: false,
              ),
            ),
          ],
        ),
      ),
    );
  }
}

CodePudding user response：

You may like CupertinoSearchTextField() widget.

You can use a TextEditingController and use it on

TextField(
  controller: controller,

while you like to perform search do, get text with controller.text