gpt4 book ai didi

flutter - 使用提供程序全局更改字体大小

转载 作者:行者123 更新时间:2023-12-05 05:06:07 25 4
gpt4 key购买 nike

我正在尝试在我的 flutter 应用程序中使用提供程序来允许用户更改某些小部件的字体大小。

我正在按照 github.com/flutter/samples/blob/master/provider_counter/lib/main.dart 中描述的方法进行操作,但字体大小没有改变。

我有一个显示加号和减号按钮的 UI 小部件:

import "package:flutter/material.dart";
import './size_controller.dart';
import 'package:provider/provider.dart';


class TypeSize extends StatelessWidget {


final _standardSize = 20.0;

@override

Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.all(20.0),
child: Row(
children: <Widget>[
Text(
"Change type size: ",
style: TextStyle(fontSize: _standardSize),
),
ButtonTheme(
minWidth: 50,
child: RaisedButton(
onPressed: () {
if (_standardSize < 23.0) {
Provider.of<FontSizeController>(context, listen: false).increment(_standardSize);
}
},
child: Text(
"+", style: TextStyle(
color: Colors.white,
fontSize: 30),
),
color: Colors.green,
),
),
ButtonTheme(
minWidth: 50,
child: RaisedButton(
onPressed: () {
if (_standardSize > 20.0) {
Provider.of<FontSizeController>(context, listen: false).decrement(_standardSize);
}
},
child: Text(
"-", style: TextStyle(
color: Colors.white,
fontSize: 30,
),
),
color: Colors.green,
),
),
],
),
);
}
}

FontSizeController 看起来像这样:

import 'package:flutter/material.dart';

class FontSizeController with ChangeNotifier {

double value = 20.0;

void increment(value) {
value ++;
notifyListeners();
}

void decrement(value) {
value --;
notifyListeners();
}

}

最后我要更改的小部件如下所示:

import 'package:flutter/material.dart';
// import 'package:wfa_ambo_bloc/main.dart';
import 'package:provider/provider.dart';
import '../controllers/size_controller.dart';

class Comfort extends StatefulWidget {
@override
_ComfortState createState() => _ComfortState();
}

class _ComfortState extends State<Comfort> {

int _comfortSliderValue = 3;
// double _standardSize = 20;

@override

Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.only(bottom: 40),
child: Column(
children: <Widget>[
Align(
alignment: Alignment.centerLeft,
child: ChangeNotifierProvider(
create: (context) => FontSizeController(),
child: Container(
padding: EdgeInsets.all(20.0),
child: Consumer<FontSizeController>(
builder: (
context,
sizeController,
child) => Text(
"How comfortable was your journey?",
textAlign: TextAlign.left,
style: TextStyle(
fontWeight: FontWeight.w400,
fontFamily: "Roboto",
letterSpacing: 0.5,
fontSize: sizeController.value,
),
),
),
),
),
),
... etc

单击按钮时没有任何反应。有人可以帮忙吗?

我尝试调整的示例全部包含在 main() 中,但我已经分离出我的小部件以尝试使所有内容更清晰 - 是什么造成了差异?

最佳答案

无需在小部件中使用变量(删除 _standardSize)。

只需将值保存在您的 ChangeNotifier 中并直接使用它(通过 getter):

import 'package:flutter/material.dart';

class FontSizeController with ChangeNotifier {

double _value = 20.0;

int get value => _value;

void increment() {
_value++;
notifyListeners();
}

void decrement() {
_value--;
notifyListeners();
}

}

然后在加号和减号按钮上,简单地增加或减少 ChangeNotifier 的值:

// on plus button pressed
Provider.of<FontSizeController>(context, listen: false).increment();

// on minus button pressed
Provider.of<FontSizeController>(context, listen: false).decrement();

最后在您希望调整文本大小的小部件中:

fontSize: Provider.of<FontSizeController>(context, listen: true).value

关于flutter - 使用提供程序全局更改字体大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60126713/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com