Flutter -将信息传递给自定义按钮控件

yizd12fk 于 2023-02-20 发布在 Flutter

关注(0)|答案(3)|浏览(120)

我正在尝试制作一个自定义按钮小部件，以便在我的代码中重用它。
在我的页面中，我这样调用这个按钮：

import 'package:app/components/MyCustomButton.dart';
[...]
const MyCustomButton(
   title: 'Title of the button',
   type: 'primary'
),

MyCustomButton的完整源代码如下。我遇到的问题是，当显示MyCustomButton. dart文件中定义的文本时，按钮工作正常。现在我不想显示静态文本，而是显示从屏幕文件传递的文本（例如：标题变量）
更改静态文本时

FROM                                     TO
-------------------------------------------------------------------------------
const Text(                         ->   const Text(
  'Login',                          ->     title,
  style: TextStyle(                 ->     style: TextStyle(
    color: Colors.white,            ->       color: Colors.white,
    fontSize: 20,                   ->       fontSize: 20,
    fontWeight: FontWeight.bold,    ->       fontWeight: FontWeight.bold,
  ),                                ->     ),
),                                  ->   ),

从'Login'到title（我想传递的），ide向我抛出"Not a constant expression"，即使我将其更改为const title。我很感谢任何关于我在这里遗漏了什么以及我做错了什么的解释。
多谢了!

import 'package:flutter/material.dart';

class MyCustomButton extends StatelessWidget{

  final String title; 
  final String type; 

  const MyCustomButton({
    super.key,
    required this.title,
    required this.type,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.fromLTRB(35, 15, 35, 15),
      margin: const EdgeInsets.symmetric(horizontal: 20),
      decoration: const BoxDecoration(
        color: Color.fromRGBO(112, 143, 164, 1),
        borderRadius: BorderRadius.all(Radius.circular(4)),
      ),
      child: const Text(
        'Login',
        style: TextStyle(
          color: Colors.white,
          fontSize: 20,
          fontWeight: FontWeight.bold,
        ),
      ),
    );
    
  }
}

flutter

来源：https://stackoverflow.com/questions/75481712/flutter-passing-information-to-custom-button-widget

3条答案

按热度按时间

lo8azlld1#

你试过从“const文本”中删除const吗？

child: Text(
        title,
        style: const TextStyle(
          color: Colors.white,
          fontSize: 20,
          fontWeight: FontWeight.bold,
        ),
      ),

赞(0）回复(0）举报 2023-02-20

fkvaft9z2#

您正在使用super.key。请改用Key? key。另外，请删除my page中的const关键字。

class MyCustomButton extends StatelessWidget {

 final String title;
  final String type;

  const MyCustomButton({
    Key? key,
    required this.title,
    required this.type,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.fromLTRB(35, 15, 35, 15),
      margin: const EdgeInsets.symmetric(horizontal: 20),
      decoration: BoxDecoration(
        color: const Color.fromRGBO(112, 143, 164, 1),
        borderRadius: BorderRadius.circular(4),
      ),
      child: Text(
        title,
        style: const TextStyle(
          color: Colors.white,
          fontSize: 20,
          fontWeight: FontWeight.bold,
        ),
      ),
    );
  }
}

赞(0）回复(0）举报 2023-02-20

euoag5mw3#

比通

class MyCustomButton extends StatelessWidget {
      final Function() onTap;
      final String title;
      final String type;
    
      const MyCustomButton({
        super.key,
        required this.title,
        required this.type,
        required this.onTap,
      });
    
      @override
      Widget build(BuildContext context) {
        return GestureDetector(
          onTap: onTap,
          child: Container(
            padding: const EdgeInsets.fromLTRB(35, 15, 35, 15),
            margin: const EdgeInsets.symmetric(horizontal: 20),
            decoration: const BoxDecoration(
              color: Color.fromRGBO(112, 143, 164, 1),
              borderRadius: BorderRadius.all(Radius.circular(4)),
            ),
            child: const Text(
              'Login',
              style: TextStyle(
                color: Colors.white,
                fontSize: 20,
                fontWeight: FontWeight.bold,
              ),
            ),
          ),
        );
      }
    }

呼叫

MyCustomButton(title: "title", type: "type", onTap: (){print("object");}),

赞(0）回复(0）举报 2023-02-20

我来回答

Flutter -将信息传递给自定义按钮控件

3条答案

相关问题

热门标签

最新问答