PercyCJ
PercyCJ
  • 发布:2017-04-10 14:48
  • 更新:2019-10-10 12:36
  • 阅读:4506

【经验分享】MUI的picker选择器中item条目文字过长溢出,导致内容无法全部显示

分类:MUI
mui

MUI的picker选择器中item条目文字过长溢出,导致内容无法全部显示。

经过修改mui.picker.js源码,实现选中item后弹出toast显示全部文字,修改方便无bug,分享~~

    Picker.prototype.endScroll = function() {  
        var self = this;  
        if (self.list.angle < self.beginAngle) {  
            self.list.style.webkitTransition = "150ms ease-out";  
            self.setAngle(self.beginAngle);  
        } else if (self.list.angle > self.endAngle) {  
            self.list.style.webkitTransition = "150ms ease-out";  
            self.setAngle(self.endAngle);  
        } else {  
            var index = parseInt((self.list.angle / self.itemAngle).toFixed(0));  
            self.list.style.webkitTransition = "100ms ease-out";  
            self.setAngle(self.itemAngle * index);  
        }  
        self.triggerChange();  

        // -------------选择完item后,弹出toast显示选中项文本  
        self.elementItems.forEach(function(item) {  
            if(item.classList.contains('highlight'))  
                plus.nativeUI.toast(item.innerText, {verticalAlign:"center"});  
        });  
        // -------------------------------------------------  
    };

在mui.picker.js源码的 Picker.prototype.endScroll 方法中插入一段foreach循环判断当前item状态

效果:

0 关注 分享

要回复文章请先登录注册

木子1

木子1

你好楼主 我修改了为什么不管用呢
2019-10-10 12:36