Question

嗨，我有一个基本上是html页面的应用程序。我有一个问题，因为html页面比可视屏幕长，页面不会滚动。

我添加了这个div：

<div id="scrollerId" style="width:320px; height:100px" x-mojo-element="Scroller"> 
    <div >scrolling content</div>
</div>

但它没有做任何事情。

请有人帮忙解释如何添加一个。或者如果我需要在我的javascript文件或其他任何内容中添加任何内容？

source/helloworld.js

    enyo.kind({
        name: "HelloWorld",
        kind: enyo.VFlexBox,
        components: [
        {kind: "PageHeader", components: [
        {content: "Page Header"}
    ]},
    {flex: 1, kind: "Pane", components: [
    {flex: 1, kind: "Scroller", components: [
    //Insert your components here
    ]}
    ]},
    {kind: "Toolbar", components: [
     ]}
]
});

我是webos dev的新手，所以对我很轻松。

Answer 1

首先欢迎来到Enyo和webOS！试着记住Enyo是你的框架，它将创建HTML（应用程序）的元素。您通常不会直接操作它（HTML）。

举个简单的例子，你可以在渲染了'HelloWorld'之后创建你的内容：

** your previous code **
{flex: 1, kind: "Scroller", components: [
    //Insert your components here
    {content: "", name:"myContent"}
    ]}
    ]},
    {kind: "Toolbar", components: []}
    ],
    create: function() {
        this.inherited(arguments);
    },
    rendered: function() {
        this.$.myContent.setContent("I can now add Content!");
    }
});

注意Scoller中添加的名为myContent的内容容器。另外，删除HTML文件中以前创建的div。

然后在渲染的函数中添加内容。

Answer 2

了解您定位的设备可能会有所帮助。你有一个Mojo应用程序和一个Enyo应用程序，它看起来像。 Mojo适用于手机。如果你的目标是TouchPad，你应该完全切换到Enyo。

要使Mojo卷轴在webOS中工作，您需要按如下方式启用它：

this.controller.setupWidget("myScroller",
    this.attributes = {
    },
    this.model = {
       scrollbars: true,
        mode: "free"
    });

您可以在此处阅读有关Mojo中滚动条的更多信息：

http://webos101.com/Scroller

但是，我想你想要一个Enyo卷轴，这样你就可以摆脱应用程序中的HTML并使用XRay Enabler上面介绍的方法。

可以使用JavaScript函数将HTML中的DIV内容导入到Enyo类中。这是一个使用jQuery的例子：

this.$.myContent.setContent($("#someDiv").html());

请记住，您必须将allowHtml设置为true才能允许HTML内容。

垂直滚动html app webos

2 个答案: