Question

我有一个包含3张卡片的ListView。每个卡都有一个文本和不同的fontSize。如何为一张卡编写单个代码，并在ListView中为其余两张具有不同Text和fontSize的卡调用它。这将帮助我节省额外的代码行。下面的代码

 Widget homeBody = Container(
  child: ListView(
    children: <Widget>[
      SizedBox(
        height: 200.0,
        child: Card(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(8.0),
          ),
          margin: EdgeInsets.all(8.0),
          child: InkWell(
            splashColor: Colors.blueGrey,
            onTap: () {},
            child: Column(
              // crossAxisAlignment: CrossAxisAlignment.stretch,
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text(
                  'About',
                  style: TextStyle(
                      fontSize: 32.0, fontWeight: FontWeight.bold),
                ),
                Text(
                  'Vishwapreneur',
                  style: TextStyle(
                      fontSize: 32.0, fontWeight: FontWeight.bold),
                ),
              ],
            ),
          ),
        ),
      ),
      SizedBox(
        height: 200.0,
        child: Card(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(8.0),
          ),
          margin: EdgeInsets.all(8.0),
          child: InkWell(
            splashColor: Colors.blueGrey,
            onTap: () {},
            child: Row(
              // crossAxisAlignment: CrossAxisAlignment.stretch,
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text(
                  'Smart Sociothon',
                  style: TextStyle(
                      fontSize: 32.0, fontWeight: FontWeight.bold),
                ),
                // Text(
                //   'Sociothon',
                //   style: TextStyle(
                //       fontSize: 32.0, fontWeight: FontWeight.bold),
                // ),
              ],
            ),
          ),
        ),
      ),
      SizedBox(
        height: 200.0,
        child: Card(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(8.0),
          ),
          margin: EdgeInsets.all(8.0),
          child: InkWell(
            splashColor: Colors.blueGrey,
            onTap: () {},
            child: Column(
              // crossAxisAlignment: CrossAxisAlignment.stretch,
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text(
                  'Entrepreneurship',
                  style: TextStyle(
                      fontSize: 30.0, fontWeight: FontWeight.bold),
                ),
                Text(
                  'Development Cell',
                  style: TextStyle(
                      fontSize: 30.0, fontWeight: FontWeight.bold),
                ),
              ],
            ),
          ),
        ),
      ),
    ],
  ),
);

先谢谢您

Answer 1

将您的text和textSize一起传递到您的卡中。

下面的示例将为您提供一个想法

ListView list(){

    Map<String, double> items = new Map();
    items["A"] = 14.0;
    items["B"] = 24.0;
    items["C"] = 32.0;

    return new  ListView.builder(
        itemCount: items.length,
        itemBuilder: (context, index) {
          return myCard(items.keys.toList()[index], items.values.toList()[index]);
        },
    );
  }

  Card myCard(String text, double textSize){
    return new Card(
      child: Padding(
        padding: const EdgeInsets.all(12.0),
        child: Text(text, style: TextStyle(fontSize: textSize),),
      ),
    );
  }

如何避免ListView中多个卡的代码重复

1 个答案: