webos - 垂直滚动条 html 应用 webos

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

了解您的目标设备可能会有所帮助。看起来像是 Mojo 应用程序和 Enyo 应用程序的混合体。 Mojo 用于手机。如果您的目标是触摸板，您可能应该完全切换到 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 内容。