Android自定義搖桿

轉載請說明出處！
作者：kqw攻城獅
出處：個人站 | CSDN

---

部署

To get a Git project into your build:

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.kongqw:AndroidRocker:1.0.1'
}

使用

XML

<com.kongqw.rockerlibrary.view.RockerView
    android:id="@+id/rockerView"
    android:layout_width="200dp"
    android:layout_height="200dp"
    kongqw:areaBackground="@drawable/default_area_bg"
    kongqw:rockerBackground="@drawable/default_rocker_bg"
    kongqw:rockerRadius="30dp" />

Activity

初始化

RockerView rockerView = (RockerView) findViewById(R.id.rockerView);

設置回調模式

// 設置回調模式
rockerView.setCallBackMode(RockerView.CallBackMode.CALL_BACK_MODE_STATE_CHANGE);

監聽搖動方向

// 監聽搖動方向
rockerView.setOnShakeListener(RockerView.DirectionMode.DIRECTION_8, new RockerView.OnShakeListener() {
    @Override
    public void onStart() {
        mLogLeft.setText(null);
    }

    @Override
    public void direction(RockerView.Direction direction) {
        mLogLeft.setText("搖動方向 : " + getDirection(direction));
    }

    @Override
    public void onFinish() {
        mLogLeft.setText(null);
    }
});

監聽搖動角度

// 監聽搖動角度
rockerViewRight.setOnAngleChangeListener(new RockerView.OnAngleChangeListener() {
    @Override
    public void onStart() {
        mLogRight.setText(null);
    }

    @Override
    public void angle(double angle) {
        mLogRight.setText("搖動角度 : " + angle);
    }

    @Override
    public void onFinish() {
        mLogRight.setText(null);
    }
});

---

效果圖

源碼

KqwRockerDemo

喜歡就給個star，謝謝！

功能

• 支持自適應大小
• 支持2個方向、4個方向、8個方向的搖動監聽
• 支持搖動角度獲取
• 可選回調模式
• 支持可搖動區域自定義
• 支持搖桿自定義
• 支持設置圖片、色值、Shape圖形

使用

<kong.qingwei.rockerlibrary.RockerView
    android:id="@+id/rockerView_center"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_centerHorizontal="true"
    kongqw:areaBackground="#FF333333"
    kongqw:rockerBackground="#FF987654"
    kongqw:rockerRadius="15dp" />

參數

參數	是否必須	描述
areaBackground	可選	可搖動區域的背景
rockerBackground	可選	搖桿的背景
rockerRadius	可選	搖桿半徑

設置回調方式

setCallBackMode(CallBackMode mode)

參數

回調方式	描述
CALL_BACK_MODE_MOVE	有移動就立刻回調
CALL_BACK_MODE_STATE_CHANGE	狀態有變化的時候回調

監聽搖動角度

返回角度的取值範圍：[0°,360°)

setOnAngleChangeListener(OnAngleChangeListener listener)

監聽搖動方向

setOnShakeListener(DirectionMode directionMode, OnShakeListener listener)

支持監聽的方向

方向	圖	描述
DIRECTION_2_HORIZONTAL		橫向 左右兩個方向
DIRECTION_2_VERTICAL		縱向 上下兩個方向
DIRECTION_4_ROTATE_0		四個方向
DIRECTION_4_ROTATE_45		四個方向 旋轉45°
DIRECTION_8		八個方向

方向描述

方向	描述
DIRECTION_LEFT	左
DIRECTION_RIGHT	右
DIRECTION_UP	上
DIRECTION_DOWN	下
DIRECTION_UP_LEFT	左上
DIRECTION_UP_RIGHT	右上
DIRECTION_DOWN_LEFT	左下
DIRECTION_DOWN_RIGHT	右下
DIRECTION_CENTER	中間

例子

RockerView rockerViewLeft = (RockerView) findViewById(R.id.rockerView_left);
if (rockerViewLeft != null) {
    rockerViewLeft.setCallBackMode(RockerView.CallBackMode.CALL_BACK_MODE_STATE_CHANGE);
    rockerViewLeft.setOnShakeListener(RockerView.DirectionMode.DIRECTION_8, new RockerView.OnShakeListener() {
        @Override
        public void onStart() {
            mLogLeft.setText(null);
        }

        @Override
        public void direction(RockerView.Direction direction) {
            mLogLeft.setText("搖動方向 : " + getDirection(direction));
        }

        @Override
        public void onFinish() {
            mLogLeft.setText(null);
        }
    });
}

RockerView rockerViewRight = (RockerView) findViewById(R.id.rockerView_right);
if (rockerViewRight != null) {
    rockerViewRight.setOnAngleChangeListener(new RockerView.OnAngleChangeListener() {
        @Override
        public void onStart() {
            mLogRight.setText(null);
        }

        @Override
        public void angle(double angle) {
            mLogRight.setText("搖動角度 : " + angle);
        }

        @Override
        public void onFinish() {
            mLogRight.setText(null);
        }
    });
}