How to update 100 Button's Title in Flutter

Question

Lets say i have a button. So..

String buttonTitle = "Upload";

Above is the button title.

Now i have set this in my text of the button. When i upload something, i want this text to be Uploaded so i use setState method for that and hence the title of the button will be updated. But let's suppose i have 100s of buttons which just says Upload and later have to be changed to just Uploaded if something has been uploaded using that button, am i going to create 100 Strings here? This approach doesn't seem good enough to me. Is there a better approach for this in flutter ?

Answer 1

Check this widget as you expect . click on main button it will update all button state after 3 second like uploading

class MyHomePages2 extends StatefulWidget {
  MyHomePages2({Key? key}) : super(key: key);
  var Upload = "Upload";

  @override
  State<MyHomePages2> createState() => _MyHomePages2State();
}

class _MyHomePages2State extends State<MyHomePages2> {
  @override
  Widget build(BuildContext context) {
    return ListView(
      children: [
        ElevatedButton(
            onPressed: () {
              setState(() {
                widget.Upload = "upload";
              });
              Future.delayed(Duration(seconds: 3), () {
                setState(() {
                  widget.Upload = "uploaded";
                });
              });
            },
            child: Text("MainUpload")),
        ...List.generate(
            100,
            (index) => Padding(
              padding: const EdgeInsets.all(8.0),
              child: ElevatedButton(
                  onPressed: () {}, child: Text("$index ${widget.Upload}")),
            ))
      ],
    );
  }
}

SampleCode Dartpad live code

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

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

int myvalue = 0;

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  @override
  void initState() {
    // functions().then((int value) {
    //   setState(() {
    //     myvalue = value;
    //   });
    // future is completed you can perform your task
    // });
  }

  Future<int> functions() async {
    // do something here
    return Future.value();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: MyHomePages2(),
    );
  }
}

class MyHomePages2 extends StatefulWidget {
  MyHomePages2({Key? key}) : super(key: key);
  var Upload = "Upload";

  @override
  State<MyHomePages2> createState() => _MyHomePages2State();
}

class _MyHomePages2State extends State<MyHomePages2> {
  @override
  Widget build(BuildContext context) {
    return ListView(
      children: [
        ElevatedButton(
            onPressed: () {
              setState(() {
                widget.Upload = "upload";
              });
              Future.delayed(Duration(seconds: 3), () {
                setState(() {
                  widget.Upload = "uploaded";
                });
              });
            },
            child: Text("MainUpload")),
        ...List.generate(
            100,
            (index) => Padding(
              padding: const EdgeInsets.all(8.0),
              child: ElevatedButton(
                  onPressed: () {}, child: Text("$index ${widget.Upload}")),
            ))
      ],
    );
  }
}