Android 修改SystemUI 音量条的声音进度条样式

一、前言

        Android System UI 开发经常会遇到修改音量进度条样式的需求，主要涉及的类有VolumeDialogImpl与xml文件，接下来会逐步实现流程。先看看效果。

修改前

修改后

二、找到对应类

通过aidegen 打断点调试对应代码类VolumeDialogImpl定位到volume_dialog就是对话框布局。mDialog.setContentView(R.layout.volume_dialog);

类路径：frameworks/base/packages/SystemUI/src/com/android/systemui/volume/VolumeDialogImpl.java

private void initDialog() {
        mDialog = new CustomDialog(mContext);

        initDimens();

        mConfigurableTexts = new ConfigurableTexts(mContext);
        mHovering = false;
        mShowing = false;
        mWindow = mDialog.getWindow();
        mWindow.requestFeature(Window.FEATURE_NO_TITLE);
        mWindow.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
        mWindow.clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND
                | WindowManager.LayoutParams.FLAG_LAYOUT_INSET_DECOR);
        mWindow.addFlags(WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE
                | WindowManager.LayoutParams.FLAG_NOT_TOUCH_MODAL
                | WindowManager.LayoutParams.FLAG_SHOW_WHEN_LOCKED
                | WindowManager.LayoutParams.FLAG_WATCH_OUTSIDE_TOUCH
                | WindowManager.LayoutParams.FLAG_HARDWARE_ACCELERATED);
        mWindow.addPrivateFlags(WindowManager.LayoutParams.PRIVATE_FLAG_TRUSTED_OVERLAY);
        mWindow.setType(WindowManager.LayoutParams.TYPE_VOLUME_OVERLAY);
        mWindow.setWindowAnimations(com.android.internal.R.style.Animation_Toast);
        WindowManager.LayoutParams lp = mWindow.getAttributes();
        lp.format = PixelFormat.TRANSLUCENT;
        lp.setTitle(VolumeDialogImpl.class.getSimpleName());
        lp.windowAnimations = -1;
        lp.gravity = mContext.getResources().getInteger(R.integer.volume_dialog_gravity);
        mWindow.setAttributes(lp);
        mWindow.setLayout(WRAP_CONTENT, WRAP_CONTENT);

        mDialog.setContentView(R.layout.volume_dialog);
        mDialogView = mDialog.findViewById(R.id.volume_dialog);
        mDialogView.setAlpha(0);
        mDialog.setCanceledOnTouchOutside(true);

三、音量条代码

 @SuppressLint("InflateParams")
    private void initRow(final VolumeRow row, final int stream, int iconRes, int iconMuteRes,
            boolean important, boolean defaultStream) {
        row.stream = stream;
        row.iconRes = iconRes;
        row.iconMuteRes = iconMuteRes;
        row.important = important;
        row.defaultStream = defaultStream;
        row.view = mDialog.getLayoutInflater().inflate(R.layout.volume_dialog_row, null);
        row.view.setId(row.stream);
        row.view.setTag(row);
        row.header = row.view.findViewById(R.id.volume_row_header);
        row.header.setId(20 * row.stream);
        if (stream == STREAM_ACCESSIBILITY) {
            row.header.setFilters(new InputFilter[] {new InputFilter.LengthFilter(13)});
        }
        row.dndIcon = row.view.findViewById(R.id.dnd_icon);
        row.slider = row.view.findViewById(R.id.volume_row_slider);
        row.slider.setOnSeekBarChangeListener(new VolumeSeekBarChangeListener(row));
        row.number = row.view.findViewById(R.id.volume_number);

        row.anim = null;

        final LayerDrawable seekbarDrawable =
                (LayerDrawable) mContext.getDrawable(R.drawable.volume_row_seekbar);

        final LayerDrawable seekbarProgressDrawable = (LayerDrawable)
                ((RoundedCornerProgressDrawable) seekbarDrawable.findDrawableByLayerId(
                        android.R.id.progress)).getDrawable();

        row.sliderProgressSolid = seekbarProgressDrawable.findDrawableByLayerId(
                R.id.volume_seekbar_progress_solid);
        final Drawable sliderProgressIcon = seekbarProgressDrawable.findDrawableByLayerId(
                        R.id.volume_seekbar_progress_icon);
        row.sliderProgressIcon = sliderProgressIcon != null ? (AlphaTintDrawableWrapper)
                ((RotateDrawable) sliderProgressIcon).getDrawable() : null;

        row.slider.setProgressDrawable(seekbarDrawable);

        row.icon = row.view.findViewById(R.id.volume_row_icon);

        row.setIcon(iconRes, mContext.getTheme());

        if (row.icon != null) {
            if (row.stream != AudioSystem.STREAM_ACCESSIBILITY) {
                row.icon.setOnClickListener(v -> {
                    Events.writeEvent(Events.EVENT_ICON_CLICK, row.stream, row.iconState);
                    mController.setActiveStream(row.stream);
                    if (row.stream == AudioManager.STREAM_RING) {
                        final boolean hasVibrator = mController.hasVibrator();
                        if (mState.ringerModeInternal == AudioManager.RINGER_MODE_NORMAL) {
                            if (hasVibrator) {
                                mController.setRingerMode(AudioManager.RINGER_MODE_VIBRATE, false);
                            } else {
                                final boolean wasZero = row.ss.level == 0;
                                mController.setStreamVolume(stream,
                                        wasZero ? row.lastAudibleLevel : 0);
                            }
                        } else {
                            mController.setRingerMode(
                                    AudioManager.RINGER_MODE_NORMAL, false);
                            if (row.ss.level == 0) {
                                mController.setStreamVolume(stream, 1);
                            }
                        }
                    } else {
                        final boolean vmute = row.ss.level == row.ss.levelMin;
                        mController.setStreamVolume(stream,
                                vmute ? row.lastAudibleLevel : row.ss.levelMin);
                    }
                    row.userAttempt = 0;  // reset the grace period, slider updates immediately
                });
            } else {
                row.icon.setImportantForAccessibility(View.IMPORTANT_FOR_ACCESSIBILITY_NO);
            }
        }
    }

四、音量条布局则位于volume_dialog_row.xml中

<!--
     Copyright (C) 2015 The Android Open Source Project

     Licensed under the Apache License, Version 2.0 (the "License");
     you may not use this file except in compliance with the License.
     You may obtain a copy of the License at

          http://www.apache.org/licenses/LICENSE-2.0

     Unless required by applicable law or agreed to in writing, software
     distributed under the License is distributed on an "AS IS" BASIS,
     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
     See the License for the specific language governing permissions and
     limitations under the License.
-->
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:tag="row"
    android:layout_height="wrap_content"
    android:layout_width="@dimen/volume_dialog_panel_width"
    android:clipChildren="false"
    android:clipToPadding="false"
    android:gravity="center"
    android:paddingTop="@dimen/volume_dialog_ringer_rows_padding"
    android:paddingBottom="@dimen/volume_dialog_ringer_rows_padding"
    android:background="@drawable/volume_row_rounded_background"
    android:theme="@style/volume_dialog_theme">

    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="@dimen/volume_dialog_panel_width"
        android:gravity="center"
        android:layout_gravity="center"
        android:orientation="vertical" >
        <TextView
            android:id="@+id/volume_row_header"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ellipsize="end"
            android:maxLength="10"
            android:maxLines="1"
            android:visibility="gone"
            android:textColor="?android:attr/colorControlNormal"
            android:textAppearance="@style/TextAppearance.Volume.Header" />
        <FrameLayout
            android:id="@+id/volume_row_slider_frame"
            android:layout_width="match_parent"
            android:layout_height="@dimen/volume_row_slider_height">
            <SeekBar
                android:id="@+id/volume_row_slider"
                android:paddingLeft="0dp"
                android:paddingRight="0dp"
                android:paddingStart="0dp"
                android:paddingEnd="0dp"
                android:clickable="true"
                android:layout_width="@dimen/volume_row_slider_height"
                android:layout_height="match_parent"
                android:layout_gravity="center"
                android:thumb="@null"
                android:splitTrack="false"
                android:progressDrawable="@drawable/volume_row_seekbar"
                android:background="@null"
                android:layoutDirection="ltr"
                android:rotation="270" />
            <include layout="@layout/volume_dnd_icon"/>
        </FrameLayout>

        <com.android.keyguard.AlphaOptimizedImageButton
            android:visibility="gone"
            android:id="@+id/volume_row_icon"
            style="@style/VolumeButtons"
            android:layout_width="@dimen/volume_dialog_tap_target_size"
            android:layout_height="@dimen/volume_dialog_tap_target_size"
            android:background="@drawable/ripple_drawable_20dp"
            android:layout_marginBottom="@dimen/volume_dialog_row_margin_bottom"
            android:tint="@color/accent_tint_color_selector"
            android:soundEffectsEnabled="false" />
    </LinearLayout>

</FrameLayout>

对SeekBar音量条进行修改增加样式

android:thumb="@drawable/ic_launcher_round"
android:progressDrawable="@drawable/volume_row_seekbar"

其中icon progress 就是一张ic_launcher_round图片
而volume_row_seekbar.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/background"
          android:gravity="center_vertical|fill_horizontal">
        <shape android:shape="rectangle">
            <size android:height="@dimen/seek_bar_height" />
            <solid android:color="#eeeeee" />
            <corners android:radius="@dimen/seek_bar_corner_radius" />
        </shape>
    </item>
    <item android:id="@android:id/progress"
          android:gravity="center_vertical|fill_horizontal">
        <scale android:scaleWidth="100%">
            <shape android:shape="rectangle">
                <size android:height="@dimen/seek_bar_height" />
                <solid android:color="#0091ff" />
                <corners android:radius="@dimen/seek_bar_corner_radius" />
            </shape>
        </scale>
    </item>
</layer-list>

五、待续