在專案中需要用到五星評價,但是找的元件都是只能點亮半顆星 或者一顆星星,不能實現3.7,4.2這樣的評分,而且此需求不能改。。。。所以就自己琢磨了乙個方法。
效果如下:
思路如下:
每個小星星都是乙個正方形,中間是透明的,然後無間隙排在一起放在乙個父盒子裡。父盒子高和星星一樣高,寬,根據實際評分來動態實現,最寬是五分。然後給父盒子乙個背景色即可
**如下:
style
="width
: 150rpx;
">
class
="img-bg"
style
="width:
}rpx
" >
style
="width
: 150rpx;
">
src=
"/static/image/start2.png"
class
="start"
>
image
>
src=
"/static/image/start2.png"
class
="start"
>
image
>
src=
"/static/image/start2.png"
class
="start"
>
image
>
src=
"/static/image/start2.png"
class
="start"
>
image
>
src=
"/static/image/start2.png"
class
="start"
>
image
>
view
>
view
>
view
>
//樣式如下
.start
.img-bg
自定義RatingBar(星星)
原文 android系統自帶ratingbar,無法直接指定寬高,不然會出現無法全部顯示的情況,使用系統自帶的兩個主題 android attr ratingbarstyleindicator和 android attr ratingbarstylesmall 也只能做到固定小版或者大版。按照以下幾...
小程式自定義TabBar
tabbar requiredbackgroundmodes audio location debug true,sitemaplocation sitemap.json 查資料發現,tabbar的list下的第一項的路徑必須對應於pages配置下的第乙個頁面。因此,將tabbar中list的第乙個...
小程式自定義Tabbar
最近我司改版小程式主頁,個性化了tabbar欄,功能如下 1 預設首頁顯示大圖示,滾動到一定位置,顯示gotop圖示,點選可返回頂部 滑動到頂部也可還原圖示 還原圖示 2 其他tabbar頁類似 在此簡單做個記錄 tabbar 3 在components資料夾內新增自定義custom tab bar...