在构建函数之外使用BuildContext

我有一个构建可重复使用的小部件的功能,在该功能中,我想设置文本主题。我的问题是要这样做,我需要访问BuildContext。我能想到的唯一方法是在每个函数调用中将其作为参数传递,但是感觉好像必须有一个更简单的方法。还是这是最好的方法?

这是当前代码:

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

import 'package:snapping_page_scroll/snapping_page_scroll.dart';

void main() => runApp(MaterialApp(
      theme: ThemeData(
        backgroundColor: Color(0xff121217),textTheme: TextTheme(
           headline: TextStyle(fontSize: 40)
         )
      ),home: SplashScreen(),));

class SplashScreen extends StatefulWidget {
  @override
  _SplashScreenState createState() => _SplashScreenState();
}

class _SplashScreenState extends State<SplashScreen> {
  @override
  void initState() {
    super.initState();
    loadData();
  }

  //Simulates loading of data
  Future<Timer> loadData() async {
    return new Timer(Duration(seconds: 1),onDoneLoading);
  }

  onDoneLoading() async {
    Navigator.of(context).push(MaterialPageRoute(builder: (context) => Home()));
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Color(0xff121217),child: Padding(
        padding: const EdgeInsets.all(20),child: Image.asset('assets/logo.png'),),);
  }
}

class Home extends StatelessWidget {

  Widget page(text,color,context){
    return Container(
      color: color,child: Align(
        alignment: Alignment(0,0.5),child: Text(text,style: Theme.of(context).textTheme.headline,);
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(),body: snappingPageScroll(
          children: <Widget>[
            page('Page 1',Colors.orange,context),page('Page 2',Colors.green,],);
  }
}

xiariweiyang 回答:在构建函数之外使用BuildContext

您可以使用构建器小部件。 ... https://api.flutter.dev/flutter/widgets/Builder-class.html

,

您可以在构建方法内访问BuildContext。

因此您可以将place()函数移至内部版本。

Widget build(BuildContext context) {
  page(text,color) {
    return Container(
      color: color,child: Align(
        alignment: Alignment(0,0.5),child: Text(
          text,style: Theme.of(context).textTheme.headline,),);
  }

  return MaterialApp(
    home: Scaffold(
      appBar: AppBar(),body: Column(
        children: <Widget>[
          page('Page 1',Colors.orange),page('Page 2',Colors.green),],);
}

在像您这样的情况下,一个好的模式是创建自己的可重用的Page小部件并通过构造函数传递参数。

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(),body: Column(
          children: <Widget>[
            _Page(text: 'Page 1',color: Colors.orange),_Page(text: 'Page 2',color: Colors.green),);
  }
}

class _Page extends StatelessWidget {
  const _Page({
    Key key,@required this.color,@required this.text,}) : super(key: key);

  final Color color;
  final String text;
  @override
  Widget build(BuildContext context) {
    return Container(
      color: color,);
  }
}
本文链接:https://www.f2er.com/3163437.html

大家都在问