小编kru*_*kat的帖子

颤振卡颜色

我想制作这张卡片,我已将其分为几列(扩展小部件),我面临的问题是:我无法将颜色容器(右列的父级)设置为全高,因此只有其中一部分显示彩色背景。

我拥有的:

在此输入图像描述

我想要的是: 在此输入图像描述

  • 我尝试了 Flutter Inspector 工具,发现容器及其子列没有获得完整高度(即使在输入 mainAxisSize: MainAxisSize.max 之后)

  • 我没有使用 Expanded,而是尝试使用 FractionSized.. 但运气不佳。

代码 :

    import 'package:flutter/material.dart';

    class SubjectPage extends StatelessWidget {
      final String dayStr;
      SubjectPage(this.dayStr);

      @override
      Widget build(BuildContext context) {
        return Padding(
          padding: EdgeInsets.fromLTRB(20.0, 40.0, 20.0, 0),
          child: Column(
            children: <Widget>[
              Card(
                child: Row(
                  children: <Widget>[
                    // Column 1
                    Expanded(
                      flex: 7,
                      child: Padding(
                        padding: EdgeInsets.all(20.0),
                        child: Column(
                          mainAxisSize: MainAxisSize.min,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: <Widget>[
                            getTitle("UEC607"),
                            getSubName("Data Communication & Protocol"),
                            getVenue("E-204"),
                          ],
                        ),
                      ),
                    ),
                    // Column 2
                    // …
Run Code Online (Sandbox Code Playgroud)

flutter flutter-layout

6
推荐指数
1
解决办法
3万
查看次数

使用mustache.js将数组数据渲染成表格行;停留在实现行编辑上

我正在创建一个用于跟踪费用的应用程序。

这是一个包含所有源代码的代码笔。

费用跟踪应用程序屏幕截图


我有一个名为的全局对象object,我将其渲染到 Mustache 模板:

var object = {
    info : [
        {date: "14, July", day: "Saturday", item: "Lunch", price: 40}
        {date: "15, July", day: "Sunday", item: "Airport", price: 80}
        {date: "14, July", day: "Saturday", item: "Snacks", price: 25}
    ],
    withdrew: 0
};
Run Code Online (Sandbox Code Playgroud)
{{#info}}
<tr>
    <td>{{date}}</td>
    <td>{{day}}</td>
    <td>{{item}}</td>
    <td>{{price}} /-</td>
    <td><a href="#" id="editInfo">Edit</a> | <a href="#" id="deleteInfo">Delete</a></td>
</tr>
{{/info}}
Run Code Online (Sandbox Code Playgroud)
Mustache.render(template, object);
Run Code Online (Sandbox Code Playgroud)

当用户在“添加项目” div(屏幕截图右侧)中输入详细信息时,info数组object将被填充(当前有 3 个条目)。


我陷入困境的部分是当用户单击“修改”表列中的“编辑”或“删除”按钮时编辑一行。我将以下点击侦听器绑定到表:

var modifyBtn = document.querySelector('table');
modifyBtn.addEventListener('click', function(e){ …
Run Code Online (Sandbox Code Playgroud)

javascript html-table mustache

5
推荐指数
1
解决办法
2939
查看次数