Question

我正在尝试以砖石风格实现md-grid-list，但我似乎不得不决定我希望显示器延伸多少行。

我想显示具有不同比例的各种图像（想想pinterest），因此col与行的比率可能并不总是有效。有没有办法用材料设计这样做而不必裁剪图片或拉伸它们？

PS：我知道Disandro的砖石，我正在寻找一种纯粹的材料设计解决方案。

我重复使用了此处的代码：https://material.angularjs.org/#/demo/material.components.gridList

由于

Answer 1

Kuzzmi，你是一个天才这样的东西（有待改进）

1-您使md-grid-list的列数与容器的宽度相同

2- md-rowspan和md-colspan需要具有图像的大小。我确信有些事情需要改进（窗口调整大小等......但是想法就在那里）

很高兴听到您的想法

<md-grid-list md-cols="1133" md-row-height="1:1">
<md-grid-tile ng-repeat="i in images" md-rowspan="{{i.h}}" md-colspan="{{i.w}}">
  <img ng-src="{{i.src}}"/>
  <md-grid-tile-footer>
    <h3>{{i.title}}</h3>
  </md-grid-tile-footer>
</md-grid-tile>

使用角度材质创建类似砖石的md-grid-list

1 个答案: