Ejemplo n. ° 005: el componente principal llama al método del componente secundario (Learning Flutter, día 2)

Dirección de prueba: (la página web se carga lentamente)
demostración de la página web

1. Crea un proyecto

flutter create example005_fatherson

2. AS se abre

3. Agregar dependencias

Modificar pubspec.yaml

dependencies:
  flutter:
    sdk: flutter


  # The following adds the Cupertino Icons font to your application.
  # Use with the CupertinoIcons class for iOS style icons.
  cupertino_icons: ^1.0.2
  english_words: ^3.1.5

4. Modificar mart.dart

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

void main() {
  runApp(MyApp());
}

// 重点是 sonKey 变量
GlobalKey<_RandomWordState> sonKey = GlobalKey();

class MyApp extends StatelessWidget {


  final wordPair = WordPair.random();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Hello world!',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home:Center(
          // child: Text("Hello world!"),
          // child:Text(wordPair.asPascalCase),
        child:Container(
          alignment: Alignment.center,
          padding: EdgeInsets.all(10.0),
          child: GestureDetector(
          child: RandWords(key:sonKey),
          onTap: (){
            sonKey.currentState.change();
          }
          )
        ),
      )

    );
  }
}

class RandWords extends StatefulWidget
{
  RandWords({Key key}) : super(key: key);

  @override
  _RandomWordState createState() {
    return _RandomWordState();
  }

}

class _RandomWordState extends State<StatefulWidget>
{
  String _wordPair = WordPair.random().asPascalCase;

  void change()
  {
    setState(() {
      _wordPair = WordPair.random().asPascalCase;
    });
  }

  @override
  Widget build(BuildContext context)
  {
    // final wordPair = WordPair.random();
    return Text(_wordPair);
  }

}

5. Depuración y ejecución

Primero abra el simulador de Android o iOS en AS y haga clic en el botón Ejecutar.
O ejecutar en la línea de comando:

flutter run

6. Empaqueta la web

flutter build web

Supongo que te gusta

Origin blog.csdn.net/qiang2080/article/details/115108748
Recomendado
Clasificación