我正在尝试使用着名的SequentialLayout在滚动视图下面添加图像,并且IM滚动视图的高度有问题。

这是我如何创建滚动视图。

var scrollview = new Scrollview({       
    direction: Utility.Direction.X,
    options: {
        size: [300, 300]
    },        
    paginated: true
});
.

当我向滚动视图添加250高度时,包含这些表面的滚动视图的父DOM容器(着名组)的宽度和高度为0。

当在续纹范围内添加此滚动视图作为第一个项目时,在此滚动视图的顶部显示具有高度的第二项或表面,因为它没有高度。

如何使用famo.us修复此操作的任何想法?

有帮助吗?

解决方案

无法设置类似的大小 - 使用修饰符。

这将是渲染树

MainContext
   SequentialLayout
      Modifier(size)
          ScrollView
      Modifier(size)
          Image
.

代码片段:

// Create components
var scrollview = new ScrollView();
var image = new ImageSurface({
    content: 'content/images/famous_symbol_transparent.png'
});

// Create Size Modifiers
var scrollModifier = new StateModifier({ size: [200,200]});
var imageModifier = new StateModifier({ size: [200,200]});

// Wrap the Modifier in a RenderNode, so we can add the surface
// (you can't add surfaces directly to a modifier)
var scrollNode = new RenderNode(scrollModifier)
scrollNode.add(scrollview);

var imageNode = new RenderNode(imageModifier);
imageNode.add(image);

// Create a SequentialLayout
var sequence = new SequentialLayout();
sequence.sequenceFrom([scrollNode,imageNode]);
.

和这里是一个示例gist (在运行main.js发生器后复制 - 粘贴yo famous

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top