直播平臺軟體開發,Extjs Grid自動換行

zhibo系統開發發表於2023-01-13

直播平臺軟體開發,Extjs Grid自動換行

定義列的時候加個 renderer,例 

Js程式碼    

   
{    
     header : '序號',    
     dataIndex : 'ind',    
     renderer: function(value, meta, record) {    
         meta.attr = 'style="white-space:normal;"';     
         return value;     
    }  
}

使用自動換行又會帶來一個新的問題,那就是不需要換行的列在豎直方向上沒有居中顯示,而是靠上對齊,要想在豎直方向上居中顯示還得改下 grid 的樣式,本人不贊成直接修改 ext-all.css,一個是尊重人家的版權,還有就是改多了,以後自己都記不清。那麼要想改過成單元格都豎直居中,只需在頁面或者自己的樣式定義裡面重寫一個樣式即可:

Html程式碼    

<style type="text/css">  
        .x-grid3-row td, .x-grid3-summary-row td {  
                line-height:13px;  
                vertical-align: middle;  
                padding-left:1px;  
                padding-right:1px;  
                -moz-user-select: none;  
                -khtml-user-select:none;  
                -webkit-user-select:ignore;  
        }  
</style>

其實看過原碼就知道了,裡面只有 vertical-align: middle; 才是設定對齊用的,其他的都是原來定義的樣式,只是把這個對齊由原來的 top 改成了 middle 而已。這樣就能既達到了有些列自動換行的目的,而且又不影響到 grid 的美觀了。

以上就是直播平臺軟體開發,Extjs Grid自動換行, 更多內容歡迎關注之後的文章 


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69978258/viewspace-2932110/,如需轉載,請註明出處,否則將追究法律責任。

相關文章