вертикальный скроллер

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. Моджо для телефонов. Если вы ориентируетесь на сенсорную панель, вам, вероятно, следует полностью перейти на Enyo.

Чтобы скроллер Mojo работал в webOS, необходимо включить его следующим образом:

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

Подробнее о скроллерах в Моджо можно прочитать здесь:

http://webos101.com/Scroller

Однако я думаю, что вам нужен скроллер Enyo, поэтому вы избавляетесь от HTML в своем приложении и используете метод, описанный выше XRay Enabler.

Можно использовать функции JavaScript для извлечения содержимого из DIV в вашем HTML в вид Enyo. Вот пример использования jQuery:

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

Имейте в виду, что для разрешения содержимого HTML вам нужно установить значение allowHtml в true.

Answer 2

Прежде всего, добро пожаловать в 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!");
    }
});

Обратите внимание на добавленный контейнер содержимого myContent в Scoller. Кроме того, удалите ранее созданные элементы div в своем HTML-файле.

Затем содержимое добавляется в визуализированную функцию.