构造函数在颤振上无法正常工作

Posted 2023-02-23

【中文标题】构造函数在颤振上无法正常工作

【英文标题】：constructor doesn't work properly on flutter

【发布时间】：2022-01-18 23:16:17

【问题描述】：

我创建了一个名为 Size 的类

类名：大小

输入代码

import 'package:flutter/material.dart';
import 'package:firstapp/pages/components/font.dart';

// ignore: must_be_immutable
class Size extends StatefulWidget 
  double font = sizevar.fontSizeRatio;
  double fontH = sizevar.fontSizeRatioH;
  Size();

  @override
  _SizeState createState() => _SizeState();


class _SizeState extends State<Size> 
  void initState() 
    sizevar.fontSizeRatio = 25;
    sizevar.fontSizeRatioH = 30;

    super.initState();
  

  _SizeState();

  @override
  Widget build(BuildContext context) 
    return Row(
      children: [
        IconButton(
          onPressed: () => setState(() 
            sizevar.fontSizeRatio = sizevar.fontSizeRatio - 2;
          ),
          icon: Icon(Icons.remove_circle_outline, color: Colors.red),
        ),
        IconButton(
            onPressed: () => setState(() 
                  sizevar.fontSizeRatio = sizevar.fontSizeRatio + 2;
                ),
            icon: Icon(Icons.add_circle_outlined, color: Colors.red)),
      ],
    );
  

上面的代码用于调整文本的字体大小。我想在不同的其他类上使用它，例如名为 SizeCheck 的类。

类名：SizeCheck

输入代码

import 'package:firstapp/pages/components/body.dart';
import 'package:firstapp/pages/components/bodyTitle.dart';
import 'package:firstapp/pages/components/font.dart';
import 'package:firstapp/pages/components/size.dart';
import 'package:flutter/material.dart';

class SizeCheck extends StatefulWidget 
  @override
  State<SizeCheck> createState() => SizeCheckState();


class SizeCheckState extends State<SizeCheck> 
  @override
  Widget build(BuildContext context) 
    return Scaffold(
      appBar: AppBar(
        title: Text("Resize",
            style: TextStyle(
              fontSize: sizevar.fontSizeRatio,
            )),
        **actions: [Size()],**
      ),
      body: ListView(
        children: <Widget>[
          Column(
            children: [
              BodyTitle("Title"),
              ContentBody('how we resize the text'),
            ],
          ),
        ],
      ),
    );
  

当我按下按钮时，文本大小不会立即改变 img when i press the button ，但是当我热重载模拟器时它可以工作。 img after hot reload the emulator 我正在使用颤振 v2.5。

【参考方案1】：

我不确定 sizevar 是什么，但这就是为什么会发生此问题以及如何解决它：

问题非常简单，您正在更新值，但您并没有告诉SizeCheck 重建自身，为此，您必须调用setState 从SizeCheck 调用它从 Size 是不够的。

要解决此问题，我建议您在 Size 中添加回调，如下所示：

class Size extends StatefulWidget 
  double font = sizevar.fontSizeRatio;
  double fontH = sizevar.fontSizeRatioH;

  VoidCallback? onSizeIncrease;
  VoidCallback? onSizeDecrease;
  
  Size(required this.onSizeIncrease, required this.onSizeDecrease);

  @override
  _SizeState createState() => _SizeState();

然后在Size的状态：

IconButton(
          onPressed: onSizeDecrease,
          icon: Icon(Icons.remove_circle_outline, color: Colors.red),
        ),
        IconButton(
            onPressed: onSizeIncrease,
            icon: Icon(Icons.add_circle_outlined, color: Colors.red)),

这样您就可以在SizeCheck 小部件上调用这些：

actions: [Size(
  onSizeIncrease: () => setState(() 
            sizevar.fontSizeRatio = sizevar.fontSizeRatio + 2;
          ),
  onSizeDecrease: () => setState(() 
            sizevar.fontSizeRatio = sizevar.fontSizeRatio - 2;
          ),
)]

【讨论】：

谢谢它在没有 VoidCallback 的情况下工作。 sizevar 是具有静态变量的类名。 sizevar static double fontSizeRatio = 22;静态双字体大小RatioH = 29；