Получить данные по нажатой кнопке

Question

Я пытаюсь изучить Флаттер и пытаюсь сделать http-запрос, как в этом примере из официальных документов, но так как я учусь, я хотел немного поэкспериментировать и изменить его , поэтому я добавил текстовое поле и кнопку, где я могу ввести идентификатор альбома, и вместо того, чтобы всегда получать альбом с идентификатором: 1, я пытаюсь сделать это так, когда я ввожу идентификатор и нажимаю кнопку Получить альбом, чтобы показать альбом с этим конкретным идентификатором. Извините за показ всего кода, но я подумал, что это может быть полезно для того, что я пытаюсь сделать.

Другая проблема заключается в том, что этот код показывает, что данные извлекаются в initState, но я пытался создать другую функцию это будет вызвано, когда кнопка нажата, но она не работала, потому что я не очень знаком с Флаттером.

import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'package:flutter_app/album.dart';

Future<Album> fetchAlbums() async {
  final response =
      await http.get('https://jsonplaceholder.typicode.com/albums/1');
  if (response.statusCode == 200) {
    return Album.fromJson(json.decode(response.body));
  } else {
    throw Exception('Failed to load album');
  }
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final _controller = TextEditingController();

  Future<Album> futureAlbum;

  @override
  void initState() {
    super.initState();
    futureAlbum = fetchAlbums();
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('My App'),
      ),
      body: Container(
          child: ListView(
        children: <Widget>[
          Stack(
            alignment: const Alignment(1.0, 1.0),
            children: <Widget>[
              TextField(
                controller: _controller,
                decoration: InputDecoration(hintText: 'Enter album ID...'),
              ),
              FlatButton(
                onPressed: () {
                  _controller.clear();
                },
                child: Icon(Icons.clear),
              ),
            ],
          ),
          RaisedButton(
            onPressed: null,
            child: Text('Get Album', style: TextStyle(fontSize: 20)),
          ),
          Column(
            children: <Widget>[
              Center(
                child: FutureBuilder<Album>(
                  future: futureAlbum,
                  builder: (context, snapshot) {
                    if (snapshot.hasData) {
                      return Text(snapshot.data.title);
                    } else if (snapshot.hasError) {
                      return Text("${snapshot.error}");
                    }
                    // By default, show a loading spinner.
                    return CircularProgressIndicator();
                  },
                ),
              ),
            ],
          ),
        ],
      )),
    );
  }
}

А примерные данные:

[
  {
    "userId": 1,
    "id": 1,
    "title": "quidem molestiae enim"
  },
  {
    "userId": 1,
    "id": 2,
    "title": "sunt qui excepturi placeat culpa"
  },
  {
    "userId": 1,
    "id": 3,
    "title": "omnis laborum odio"
  },
 ]

Обновление :

// First I modified the Future, not it get an albumId
Future<Album> fetchAlbums(int albumId) async {
  final response =
      await http.get('https://jsonplaceholder.typicode.com/albums/$albumId');
  if (response.statusCode == 200) {
    return Album.fromJson(json.decode(response.body));
  } else {
    throw Exception('Failed to load album');
  }
}

// futureAlbum is updated when the button is pressed and not in initState
onGetAlbum() {
  futureAlbum = fetchAlbums(int.parse(_controller.text));
}

// The raised button, instead of null not calls the onGetAlbum() method when is pressed.
  RaisedButton(
    onPressed: () => onGetAlbum(),
    child: Text('Get Album', style: TextStyle(fontSize: 20)),
  ),

Ошибки, которые я получаю сейчас:

W/IInputConnectionWrapper( 3266): getTextBeforeCursor on inactive InputConnection
W/IInputConnectionWrapper( 3266): getSelectedText on inactive InputConnection   
W/IInputConnectionWrapper( 3266): getTextAfterCursor on inactive InputConnectionW/IInputConnectionWrapper( 3266): beginBatchEdit on inactive InputConnectionW/IInputConnectionWrapper( 3266): endBatchEdit on inactive InputConnection

Answer 1

Итак, спустя почти день, я исправил свою проблему и узнал немного больше о дротике, моя проблема была довольно простой, но это так, когда вы начинающий.

Изменения, которые я должен был сделать, кроме тех, что были в обновлении вопроса:

RaisedButton(
            onPressed: () {
              futureAlbum = fetchAlbums(int.parse(_controller.text));
              if (_controller.text.length > 0) {
                this.setState(() {
                  _controller.clear(); // Clear value
                }); // clear the textField
                FocusScope.of(context)
                    .requestFocus(new FocusNode()); // hide the keyboard
              }
            },
            child: Text('Get Album', style: TextStyle(fontSize: 20)),
          ),