투케이2K

196. (AndroidStudio/android/java) seekbar 시크바 커스텀 디자인 제작 실시 본문

Android

196. (AndroidStudio/android/java) seekbar 시크바 커스텀 디자인 제작 실시

투케이2K 2021. 10. 2. 16:10

[개발 환경 설정]

개발 툴 : AndroidStudio

개발 언어 : java


[소스 코드]

// [Layout XML 파일 소스코드]

<SeekBar
                android:id="@+id/seekBar"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="0.7"
                android:layout_marginTop="10dp"
                android:layout_marginLeft="20dp"
                android:layout_marginRight="20dp"
                android:layout_marginBottom="20dp"

                android:thumb="@drawable/custom_seekbar_thumb"
                android:progressDrawable="@drawable/custom_seekbar_progress"
                android:splitTrack="false"/>
                <!-- thumb : 시크바 진행 아이콘 -->
                <!-- progressDrawable : 시크바 진행 배경 색상 -->
                <!-- splitTrack : 시크바 thumb 아이콘 여백 없애기 -->










// [drawable : custom_seekbar_progress.xml 파일 소스코드]

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!--시크바 배경-->
    <item android:id="@android:id/background">
        <shape android:shape="rectangle">
            <!-- 시크바 선 굵기 : 길이 10dp -->
            <stroke android:width="6dp" android:color="#B2CCFF" />
            <!-- 시크바 내용 색상 -->
            <solid android:color="#B2CCFF"/>
            <!-- 테두리 둥글게 설정 -->
            <corners android:radius="10dp"/>
        </shape>
    </item>

    <!-- 시크바 진행 프로그레스 -->
    <item android:id="@android:id/progress" >
        <clip>
            <shape android:shape="rectangle">
                <!-- 시크바 선 굵기 : 길이 10dp -->
                <stroke android:width="10dp" android:color="#6799FF" />
                <!-- 시크바 내용 색상 -->
                <solid android:color="#6799FF"/>
                <!-- 테두리 둥글게 설정 -->
                <corners android:radius="10dp"/>
            </shape>
        </clip>
    </item>

</layer-list>









// [drawable : custom_seekbar_thumb.xml 파일 소스코드]

<?xml version="1.0" encoding="utf-8"?>
<!-- 원형 시크바 컨트롤러 -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval"
    android:useLevel="false">
    <!-- 배경 -->
    <solid
        android:color="#D9E5FF"/>
    <!-- 테두리 -->
    <stroke
        android:width="2dp"
        android:color="#0054FF" />
    <!-- 크기 -->
    <size
        android:width="28dp"
        android:height="28dp"/>
</shape>









// [JAVA 파일 소스코드]

SeekBar seekBar = (SeekBar) findViewById(R.id.seekBar);
seekBar.setMax(10); // 시크바 최대값 설정
seekBar.setProgress(3); // 초기 시크바 값 설정










// [실시간 seekbar value 변경 감지]
seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {
                //TODO [SeekBar 컨트롤 진행 중]
            }
            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {
                //TODO [SeekBar 터치 이벤트 발생]
            }
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
                //TODO [SeekBar 터치 이벤트 종료]

                Log.d("---","---");
                Log.w("//===========//","================================================");
                Log.d("","\n"+"[A_DisplayLight > onProgressChanged() 메소드 : SeekBar 터치 이벤트 종료 데이터 확인 실시]");
                Log.d("","\n"+"[데이터 : " + String.valueOf(progress) + "]");
                Log.w("//===========//","================================================");
                Log.d("---","---");
            }
        });

[결과 출력]


 

반응형
Comments