Galaxy：创建后动态更新 PageIndicator

Question

我正在为 Samsung Gear S3 and Samsung Galaxy watches, using a Tizen 网络应用程序开发一个应用程序。

我正在尝试使用 PageIndicator 来显示用户滚动浏览 API 调用后生成的动态页面数量，当用户执行某些操作时，这些页面数量会发生变化。文档：https://developer.tizen.org/dev-guide/3.0.0/org.tizen.web.apireference/html/ui_fw_api/Mobile_UIComponents/mobile_PageIndicator.htm

是否可以在创建 PageIndicator 后更新页面数量？

我试过销毁它并重新创建它，但这似乎没有用。

代码

function PageController() {
    /* Keep track of scope*/
    var _this = this;

    /* Tau elements */
    var pageIndicator = null;

    this.showIndicator = function(active, total) {
        if (pageIndicator != null) {
            pageIndicator.destroy();
        }

        var elPageIndicator = document.getElementById("pageIndicator");
        pageIndicator = tau.widget.PageIndicator(
          elPageIndicator, {maxPage: total, numberOfPages: total});

        console.log("Created");
        console.log(pageIndicator);
        pageIndicator.setActive(active);
    }
}

我还尝试了在使用控制台记录器时注意到对象中存在的 configure() 或 _configure() 函数，但没有成功。

代码

function PageController() {
    /* Keep track of scope*/
    var _this = this;

    /* Tau elements */
    var pageIndicator = null;

    this.showIndicator = function(active, total) {
        if (pageIndicator == null) {
            var elPageIndicator = document.getElementById("pageIndicator");
            pageIndicator = tau.widget.PageIndicator(
              elPageIndicator, {maxPage: total, numberOfPages: total});

            console.log("Created");
            console.log(pageIndicator);
        }

        console.log("Reconfigure");
        pageIndicator.configure({maxPage: total, numberOfPages: total});
        pageIndicator.refresh();
        pageIndicator.setActive(active);
        console.log(pageIndicator);
    }
}

还尝试通过 pagindicatorobject.options.maxPage = 我的新金额和 pageindicatorobject.options.amountPages = 我的新金额手动设置选项，之后我尝试执行 refresh() 无效。

代码

function PageController() {
    /* Keep track of scope*/
    var _this = this;

    /* Tau elements */
    var pageIndicator = null;

    this.showIndicator = function(active, total) {
        if (pageIndicator == null) {
            var elPageIndicator = document.getElementById("pageIndicator");
            pageIndicator = tau.widget.PageIndicator(
              elPageIndicator, {maxPage: total, numberOfPages: total});

            console.log("Created");
            console.log(pageIndicator);
        }

        console.log("Reconfigure");
        pageIndicator.options.maxPage = total;
        pageIndicator.options.numberOfPages = total;
        pageIndicator.refresh();
        pageIndicator.setActive(active);
        console.log(pageIndicator);
    }
}

每种情况运行如下代码

var pageController = new PageController();
pageController.showIndicator(x, y);

它总是会在控制台中返回相同的 pageIndicator，而不会在给出新配置时替换它。我该如何解决这个问题？

Answer 1

请检查 UI Components (Tizen) 中的 "Setting UI Component Options" 部分。

要动态更改选项，您可以使用小部件 option 方法。在示例中：

    console.log("Reconfigure");
    pageIndicator.option({maxPage: total, numberOfPages: total})
    pageIndicator.setActive(active);
    console.log(pageIndicator);
}

在此示例中，无需调用 refresh() 方法。

或者您可以使用 HTMLElement 数据集在基本小部件 HTMLElement 上设置选项，然后在小部件上调用刷新。

示例：

    console.log("Reconfigure");
    elPageIndicator.dataset['maxPage'] = total;
    elPageIndicator.dataset['numberOfPages'] = total;
    pageIndicator.refresh();
    pageIndicator.setActive(active);
    console.log(pageIndicator);
}

Galaxy：创建后动态更新 PageIndicator

Galaxy: Dynamically update PageIndicator after creation

tizen-web-app

samsung-galaxy

代码

代码

代码