Question

是否可以使用动态内容从扩展库中提供xe：carousel控件？

首先，幻灯片节点似乎只能设置为静态？

Answer 1

我最近将其发布为answer to someone who wanted a dynamic Dashboard control，以便向他们提供想法

<xp:this.afterPageLoad><![CDATA[#{javascript:
    importPackage(com.ibm.xsp.theme.bootstrap.components.responsive);

    var photos = [["http://www.gstatic.com/webp/gallery/1.jpg","My Caption 1"]];
    photos.push(["http://www.gstatic.com/webp/gallery/2.jpg","My Caption 2"]);
    photos.push(["http://www.gstatic.com/webp/gallery/3.jpg","My Caption 3"]);
    photos.push(["http://www.gstatic.com/webp/gallery/4.jpg","My Caption 4"]);
    photos.push(["http://www.gstatic.com/webp/gallery/5.jpg","My Caption 5"]);

    var carousel:com.ibm.xsp.theme.bootstrap.components.responsive.UICarousel = getComponent("carousel1");

    for(var i = 0; i < photos.length; i++) {
        var data = photos[i];

        var slide:com.ibm.xsp.theme.bootstrap.components.responsive.SlideNode = new com.ibm.xsp.theme.bootstrap.components.responsive.SlideNode();
        slide.setBackgroundSrc(data[0]);
        slide.setCaptionText(data[1]);
        slide.setButtonLabel("Open This Image");
        slide.setButtonHref("/photo.xsp?photo=" + data[0]);
        carousel.addSlideNode(slide);
    }}]]>
</xp:this.afterPageLoad>

<xe:carousel id="carousel1" wrapped="true" pause="hover" slideInterval="2000">
</xe:carousel>

关键是首先获得对Carousel控件UICarousel底层组件的引用。然后创建一些SlideNode组件，根据需要设置其配置选项，并将它们添加到UICarousel组件。

带有动态内容的xpages轮播

1 个答案: