TextField announces value changes after it loses focus #23180
Description
I have a screen where there's a slider and a text box where both are in sync. When the user changes the value in the text box, I want the text box to announce the change; and when the user changes the value in the slider, I want the slider to announce the change. It looks something like this:
There is a problem in the following scenario:
- Turn on TalkBack.
- Focus on Slider and move it using the volume keys. You hear "Fifty percent seek control"
- Focus on Text Field. Double tap to bring up the keyboard. Then dismiss the keyboard such that the text field loses focus.
- Focus on Slider. It's still at 50%. Move the slider by pressing the volume up key. You hear "Fifty-five percent seek control. Five replaced zero."
The problem is that the text field is still announcing changes to its contents after it loses focus. This only happens after focusing on the text field, so I feel like this is a bug.
Code of sample app demonstrating this problem:
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
final String title;
const MyHomePage({Key key, this.title}) : super(key: key);
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
double _value = 0.0;
TextEditingController _controller;
@override
void initState() {
super.initState();
_controller = TextEditingController(text: '0');
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Column(
children: <Widget>[
TextField(
controller: _controller,
),
Slider(
onChanged: (value) {
setState(() {
_value = value;
});
_controller.text = (value * 100).round().toString();
},
value: _value,
)
],
),
);
}
}