i try get the text of input and save this value on variable, and pass this variable to service api request, but i get fails.

Visual code "try" help me adding constructor and variables, but dont works!

this is the code.

class FormularioYoutube extends StatelessWidget {
  const FormularioYoutube({super.key});
  @override
  Widget build(BuildContext context) {
    var _controller = TextEditingController();
    return Column(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: <Widget>[
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 16),
          child: TextFormField(
            controller: _controller,
            decoration: const InputDecoration(
              border: UnderlineInputBorder(),
              labelText: 'Insert Url Youtube',
            ),
          ),
        ),
        MaterialButton(
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                  builder: (context) => procesarBotonParaDescargarMp3()),
            );
          },
          color: Colors.blue,
          child: Text('Descargar MP3', style: TextStyle(color: Colors.white)),
        )
      ],
    );
  }
}

class procesarBotonParaDescargarMp3 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("Second Route"),
        ),
        body: FutureBuilder<YoutubeMp3?>(
            future: ApiRequest().YoutubeMp3s,
            builder: (context, snapshot) {
              if (snapshot.connectionState == ConnectionState.waiting) {
                return Center(
                  child: CircularProgressIndicator.adaptive(),
                );
              }
              final YoutubeMp3? yt = snapshot.data;
              return ListView.builder(
                  itemCount: 1,
                  itemBuilder: (context, index) {
                    return ListTile(title: Text(yt!.title));
                  });
            }));
  }
}

And in this service i need pass the variable with the url.

Service api-request

import 'package:http/http.dart' as http;
import 'package:flutter_application_1/src/model/youTubeMp3Model.dart';
class ApiRequest {
  Future<YoutubeMp3?> get YoutubeMp3s async {
    final http.Response response = await http.get(
        Uri.parse('http://url/UrlVideoYoutube/'   URLVIDEO));
    if (response.statusCode == 200) {
      print(response.body);
      return youtubeMp3FromJson(response.body);
    }
  }
}

CodePudding user response：

You need to move

var _controller = TextEditingController();

upp and make new variable to store input text:

class FormularioYoutube extends StatelessWidget {
  const FormularioYoutube({super.key});
  var _controller = TextEditingController();
  String text;
  @override
  Widget build(BuildContext context) {

@override in initState method

@override
  void initState() {
    super.initState();
    _controller.addListener(() {
      text = _controller.text;
    });

In variable text user input will store. You can send it in onPressed of the Button:

MaterialButton(
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                  builder: (context) => procesarBotonParaDescargarMp3(text)),
            );
          },
          color: Colors.blue,
          child: Text('Descargar MP3', style: TextStyle(color: Colors.white)),
        )

Through the constructor:

class procesarBotonParaDescargarMp3 extends StatelessWidget {
  String text;
  
  procesarBotonParaDescargarMp3({required this.text})
  
  @override
  Widget build(BuildContext context) {

and then to API:

class ApiRequest {
  final String url;
  ApiRequest(this.url)

CodePudding user response：

First Pass textfield value to procesarBotonParaDescargarMp3, like this:

class procesarBotonParaDescargarMp3 extends StatelessWidget {
  final String url;

  procesarBotonParaDescargarMp3(this.url);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("Second Route"),
        ),
        body: FutureBuilder<YoutubeMp3?>(
            future: ApiRequest(url).YoutubeMp3s,
            builder: (context, snapshot) {
              if (snapshot.connectionState == ConnectionState.waiting) {
                return Center(
                  child: CircularProgressIndicator.adaptive(),
                );
              }
              final YoutubeMp3? yt = snapshot.data;
              return ListView.builder(
                  itemCount: 1,
                  itemBuilder: (context, index) {
                    return ListTile(title: Text(yt!.title));
                  });
            }));
  }
}

and pass it like this:

onPressed: () {
        Navigator.push(
          context,
          MaterialPageRoute(
              builder: (context) => procesarBotonParaDescargarMp3(_controller.text)),
        );
      },

then change your Service api-request like this:

import 'package:http/http.dart' as http;
import 'package:flutter_application_1/src/model/youTubeMp3Model.dart';
class ApiRequest {
  final String url;
  ApiRequest(this.url);

  Future<YoutubeMp3?> get YoutubeMp3s async {
    final http.Response response = await http.get(
        Uri.parse('http://url/UrlVideoYoutube/'   url));
    if (response.statusCode == 200) {
      print(response.body);
      return youtubeMp3FromJson(response.body);
    }
  }
}

CodePudding user response：

In APIRequest class change the getter to a function.

Future<YoutubeMp3?> YoutubeMp3s(String url) async {
    final http.Response response = await http.get(
        Uri.parse('http://url/UrlVideoYoutube/'   url));
    if (response.statusCode == 200) {
      print(response.body);
      return youtubeMp3FromJson(response.body);
    }
  }

Then, add constructor to the procesarBotonParaDescargarMp3 class and pass the url to the above function.

class procesarBotonParaDescargarMp3 extends StatelessWidget {
  final String url;
  const procesarBotonParaDescargarMp3(this.url);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("Second Route"),
        ),
        body: FutureBuilder<YoutubeMp3?>(
            future: ApiRequest().YoutubeMp3s(url),
            builder: (context, snapshot) {
              if (snapshot.connectionState == ConnectionState.waiting) {
                return Center(
                  child: CircularProgressIndicator.adaptive(),
                );
              }
              final YoutubeMp3? yt = snapshot.data;
              return ListView.builder(
                  itemCount: 1,
                  itemBuilder: (context, index) {
                    return ListTile(title: Text(yt!.title));
                  });
            }));
  }
}

Then pass TextEditingController's value into the navigator.

Navigator.push(
              context,
              MaterialPageRoute(
                  builder: (context) => procesarBotonParaDescargarMp3(_controller.text.trim())),
            );