在SAPUI5页面中隐藏滚动条

Question

我有个问题。

我有要在页面中显示的推文列表。 对于移动设备，我不想显示右侧的垂直滚动条。

我已经建立了带有滑块和推文列表的页面。 然后我将此页面放在滚动容器中。

然后我返回滚动容器。

代码是这样的：

sap.ui.jsview("ttest.initView", {

/** Specifies the Controller belonging to this View. 
* In the case that it is not implemented, or that "null" is returned, this View does not have a Controller.
* @memberOf ttest.initView
*/ 
getControllerName : function() {
    return "ttest.initView";
},

/** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed. 
* Since the Controller is given to this method, its event handlers can be attached right away. 
* @memberOf ttest.initView
*/ 
createContent : function(oController) {

    var oTweetList = new sap.m.List("items", {  
          threshold: 2,  
          inset : false,    
          showUnread : true,  
          scrollToLoad : true,   

          columns : [
             new sap.m.Column({  
                styleClass : "data",  
                hAlign : "Left",  
             })
          ]  
    });

    var oSlider = new sap.m.Slider({
        id: "tweetSlider",
        width: '100%',
        min: 0,

        change : function(oEvent){
            //Update tweet list
            var startIndex = 0;
            var endIndex = this.getValue();
            oController.updateTweetList("update", startIndex, endIndex);
        }
    });

    var oPage = new sap.m.Page({
        title: "Tweet list for @matteorenzi",
        enableScrolling : false,
        headerContent: [
            new sap.m.Button({
                icon: "sap-icon://refresh",
                press : function(oEvent){
                    //Update tweet list with all tweets
                    oController.updateTweetList("first", "", "");
                }
            })
        ],
        content: [
            oSlider,
            oTweetList
        ]
    });

    var oScroller = new sap.m.ScrollContainer({
        vertical : true,
        horizontal : false,
        content : [
                    oPage
        ]
    });

    oEventBus.subscribe("it.besolution.PopulateList", "Go", function(chId, evId, data){
        var template = new sap.m.ColumnListItem({  
            type : "Navigation", 
            cells : [  
               new it.besolution.Tweet({
                   user :       "{user/name}",
                   username :   "{user/screen_name}",   
                   tweet :      "{text}",

                   press : function(oEvent){    
                       var path = this.getBindingContext().getPath();
                       sap.ui.getCore().byId("iduserDetails").setModel(oGlobalModel).bindElement(path);
                       app.to("iduserDetails");
                   }
               })
            ]  
        });

        oSlider.setMax(oGlobalModel.getProperty("/size") - 1);

        oTweetList.setModel(oGlobalModel);
        oTweetList.bindAggregation("items", "/tweets/", template);
    });

    return oScroller;
}

});

页面未加载。 我不知道该怎么办。 为什么列表不可见？

显然，如果删除滚动容器并返回oPage元素，则该列表可见。

为什么？ 如何编写代码以显示没有滚动条的列表？

Answer 1

如果您不想显示右侧的垂直滚动条。 有一个名为enableScrolling的属性。您确实要使用ScrollContainer ，将其作为Page内容放置，而不是相反。

enableScrolling default: true   

Page是否采取特殊措施使页面内容可滚动并保持标题固定。 如果设置为false，将完全不滚动 ； 出于性能原因，强烈建议在不需要滚动时推荐这样做。 页面仅允许垂直滚动，因为通常不建议对整页内容进行水平滚动。 如果仍然需要实现，请禁用Page滚动并使用ScrollContainer作为Page的全页内容 。 这使您可以自由配置滚动。 它也可以用于创建（垂直滚动）页面的水平滚动子区域。