聯系我們 - 廣告服務 - 聯系電話：
您的當前位置： > 關注 > > 正文

動畫顯示Ammeter支持將電量、油量以動畫形式展示（一）

來源：CSDN 時間：2023-01-30 08:58:42

一個儀表盤控件，以動畫方式顯示指定百分比值，比如電量表、油量表等。

用法


(資料圖)

將如下文件導入到您的項目中：

UIColor+Interpolate.h/.mDashboard.h/.mAmmeter.h/.m/.xib

在源文件中 import 頭文件 Ammeter.h。

可視化設計

Ammeter 支持 IB 的可視化設計。在故事板中拖入一個 UIView，在屬性面板中，設置其 Class 為 Ammeter。

在屬性面板中，你可以通過如下屬性定制 Ammeter 控件：

其中：

Mark Length 和 Mark Width: 設置彩色（漸變色）刻度線的長度和線寬。Start Color 和 EndColor : 設置彩色刻度線的漸變色范圍——起始顏色、終止顏色。Default Color : 設置空的刻度線的默認顏色（圖中用于表示已用掉的電量）。Danger Color 和 Danger Value : 設置最低閥值和警告色，例如電量少于 10% 用紅色表示，可以將 Danger Value 設置為 0.1，Danger Color 設置為紅色。Value : 設置儀表盤的當前值，比如 0.8，表示當前電量（油量）還剩 80%。Min Mark Length、Min Mark Length 和 Min Mark Color : 設置小刻度線（中間一圈的刻度線）長度、線寬及顏色。

動畫顯示

Ammeter 支持將電量、油量以動畫形式展示。你只需要調用 startAnimating 方法即可：

[ammeter startAnimating];

運行示例項目，點擊 Animating 按鈕，查看動畫效果。

定制其它 subviews

除了儀表盤（一個 Dashboard 對象），Ammeter 中還有一些文字顯示(3 個 UILabel)，你也可以通過代碼方式來定制它們。它們分別是:

UILabel *lbPower 即截圖中的 “電量”。UILabel *lbRemainder 即截圖中的 “80”。UILabel *lbPercentSign 即截圖中的 “%”。

示例程序

用 Xcode 打開 DashboardDemo.xcodeproj。支持 Xcode 6 - 7（Xcode 8.0 需要修改 Ammeter.m 中的 startAnimating 方法）。

有任何問題和建議，請與作者聯系: kmyhy@126.com。

責任編輯：

標簽：

相關推薦：

精彩放送：

新聞聚焦
Top 岛国精品在线