自定義View之刻度尺

運(yùn)行截圖

rulerview.png

Step 1. Add the JitPack repository to your build file

Add it in your root build.gradle at the end of repositories:

allprojects {
    repositories {
        ...
        maven { url 'https://jitpack.io' }
    }
}

Step 2. Add the dependency

dependencies {
    compile 'com.github.shichunlei:RulerView:1.0.0'
}

或者

Step 1. Add the JitPack repository to your build file

<repositories>
    <repository>
        <id>jitpack.io</id>
        <url>https://jitpack.io</url>
    </repository>
</repositories>

Step 2. Add the dependency

<dependency>
    <groupId>com.github.shichunlei</groupId>
    <artifactId>RulerView</artifactId>
    <version>1.0.0</version>
</dependency>

用法

1、xml

<com.chingtech.rulerview.library.RulerView
    android:id="@+id/ruler"
    android:layout_width="match_parent"
    android:layout_height="100dp"
    app:rv_alphaEnable="true"
    app:rv_indcatorColor="#414"
    app:rv_indcatorType="triangle"
    app:rv_indcatorWidth="5dp"
    app:rv_itemSpacing="8dp"
    app:rv_maxLineColor="@color/colorPrimary"
    app:rv_maxLineHeight="30dp"
    app:rv_maxLineWidth="3dp"
    app:rv_middleLineColor="#ee2"
    app:rv_middleLineHeight="20dp"
    app:rv_middleLineWidth="2dp"
    app:rv_minLineColor="#e6f"
    app:rv_minLineHeight="10dp"
    app:rv_minLineWidth="1dp"
    app:rv_resultTextColor="#444"
    app:rv_resultTextSize="20sp"
    app:rv_scaleTextColor="#e42"
    app:rv_scaleTextSize="15sp"
    app:rv_unit="CM"
    app:rv_unitTextColor="#666"
    app:rv_unitTextSize="15sp" />

2、java

RulerView rulerview = findViewById(R.id.ruler);

rulerview.initViewParam(78, 20, 180f, 1f);
rulerview.setChooseValueChangeListener(new RulerView.OnChooseResulterListener() {
    @Override
    public void onChooseValueChange(float value) {
        // TODO do some work
    }
});

自定義屬性

<declare-styleable name="RulerView">
    <attr format="float|reference" name="rv_defaultValue" />              <!-- 默認(rèn)值 -->
    <attr format="float|reference" name="rv_minValue" />                  <!-- 最小值 -->
    <attr format="float|reference" name="rv_maxValue" />                  <!-- 最大值 -->
    <attr format="float|reference" name="rv_spanValue" />                 <!-- 精度，最小支持 0.1 -->
    <attr format="dimension|reference" name="rv_itemSpacing" />           <!-- 每個(gè)刻度間的寬度 -->
    <attr format="dimension|reference" name="rv_minLineHeight" />         <!-- 最短刻度線長(zhǎng)度 -->
    <attr format="dimension|reference" name="rv_maxLineHeight" />         <!-- 最長(zhǎng)刻度線長(zhǎng)度 -->
    <attr format="dimension|reference" name="rv_middleLineHeight" />      <!-- 中間刻度線長(zhǎng)度 -->
    <attr format="dimension|reference" name="rv_minLineWidth" />          <!-- 最短刻度線寬度 -->
    <attr format="dimension|reference" name="rv_maxLineWidth" />          <!-- 最長(zhǎng)刻度線寬度 -->
    <attr format="dimension|reference" name="rv_middleLineWidth" />       <!-- 中間刻度線寬度 -->
    <attr format="color|reference" name="rv_scaleTextColor" />            <!-- 刻度盤(pán)文字顏色 -->
    <attr format="color|reference" name="rv_minLineColor" />              <!-- 最短刻度線顏色 -->
    <attr format="color|reference" name="rv_maxLineColor" />              <!-- 最大刻度線顏色 -->
    <attr format="color|reference" name="rv_middleLineColor" />           <!-- 中間刻度線顏色 -->
    <attr format="dimension|reference" name="rv_scaleTextSize" />         <!-- 刻度盤(pán)文字大小 -->
    <attr format="dimension|reference" name="rv_textMarginTop" />         <!-- 刻度盤(pán)文字距離刻度邊緣距離 -->
    <attr format="color|reference" name="rv_indcatorColor" />             <!-- 指示器顏色 -->
    <attr format="dimension|reference" name="rv_indcatorWidth" />         <!-- 指示器寬度，形狀為三角時(shí)不起作用 -->
    <attr format="dimension|reference" name="rv_indcatorHeight" />        <!-- 指示器高度，形狀為三角時(shí)不起作用 -->
    <attr format="enum|reference" name="rv_indcatorType">                 <!-- 指示器形狀 -->
        <enum name="line" value="1" />                                    <!-- 線 -->
        <enum name="triangle" value="2" />                                <!-- 三角 -->
    </attr>
    <attr format="enum|reference" name="rv_strokeCap">                    <!-- 刻度線線帽 -->
        <enum name="round" value="1" />                                   <!-- 圓角 -->
        <enum name="butt" value="0" />                                    <!-- 無(wú)圓角 -->
        <enum name="square" value="2" />                                  <!-- 矩形 -->
    </attr>
    <attr format="color|reference" name="rv_resultTextColor" />           <!-- 結(jié)果文字顏色 -->
    <attr format="color|reference" name="rv_unitTextColor" />             <!-- 單位文字顏色 -->
    <attr format="dimension|reference" name="rv_resultTextSize" />        <!-- 結(jié)果文字大小 -->
    <attr format="dimension|reference" name="rv_unitTextSize" />          <!-- 單位文字大小 -->
    <attr format="string|reference" name="rv_unit" />                     <!-- 單位 -->
    <attr format="boolean|reference" name="rv_showResult" />              <!-- 是否顯示結(jié)果 -->
    <attr format="boolean|reference" name="rv_showUnit" />                <!-- 是否顯示單位 -->
    <attr format="boolean|reference" name="rv_alphaEnable" />             <!-- 是否刻度漸變 -->
</declare-styleable>

源碼地址：https://github.com/shichunlei/RulerView