首页 > 解决方案 > 制作可重用的颤振小部件

问题描述

我一直在尝试使我的自定义小部件可重复使用,但一直处于死胡同......我希望能够使用更改图标的颜色、卡片中的文本、第一张卡片和随附的卡片......此外,我应该能够更改图标、图标内的文本以及每个按钮的点击功能应该能够在点击时执行不同的操作

   class _CustomCardState extends State<CustomCard> {
      @override
      Widget build(BuildContext context) {
        return Card(
          margin: EdgeInsets.fromLTRB(20, 10, 20, 1),
          color: Colors.red,
          child: InkWell(
            onTap: (){},
            child: ListTile(
              leading: Card(
                color: Colors.white,
                margin: EdgeInsets.all(5),
                child: Padding(
                  padding: EdgeInsets.all(8.0),
                  child: Icon(
                    KycIcons.add_a_photo,
                    size: 20,
                    color: Colors.red,
                  ),
                ),
              ),
              title: Text('Uplaod your selfie',
                  style: TextStyle(color: Colors.white, fontSize: 16)),
            ),
          ),
        );
      }
    }`

标签: flutterdart

解决方案


这是一个非常简单的示例,说明如何构建可重用的小部件:

import 'package:flutter/material.dart';

class ContainerMain extends StatelessWidget {
  String text;
  Color color; 

  ContainerMain(this.text, {this.color = Colors.white});

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    return Container(
      alignment: Alignment.center,
      height: size.height / 10,
      width: size.width,
      child: Text(
        text,
        style: TextStyle(fontSize: 20, color: color),
      ),
    );
  }
}

推荐阅读