Estilo personalizado de la barra de búsqueda de Android
No he escrito un blog durante mucho tiempo. Recientemente, necesitaba usar una barra de progreso deslizante personalizada en mi proyecto, y luego descubrí que no estaba familiarizado con ella. Lo registraré aquí. Bien, comencemos Volviendo al tema. Las siguientes representaciones: Los signos más y menos en los lados izquierdo y derecho fueron agregados por mí
. Para dibujar un ícono de barra de progreso personalizado, primero agregue el estilo seekbar_style.xml de la siguiente manera:
<?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>
<!-- 圆角程度 和 背景颜色-->
<corners android:radius="10dp" />
<solid android:color="@color/gray" />
</shape>
</item>
<!-- 进度颜色 -->
<item android:id="@android:id/progress">
<clip>
<shape>
<!-- 圆角程度 和 进度条颜色 -->
<corners android:radius="10dp" />
<solid android:color="@color/theme_color" />
</shape>
</clip>
</item>
</layer-list>
El color de fondo se refiere al color de fondo al que no se desliza la barra de progreso. No es necesario explicar el color de progreso. Jajaja, está bien. Entonces mi diseño es el siguiente:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".eleven.ElevenActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="15dp">
<!-- 减号图标-->
<ImageView
android:id="@+id/iv_decrease"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_centerVertical="true"
android:src="@mipmap/seekbar_decrease"></ImageView>
<SeekBar
android:id="@+id/seekbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_toLeftOf="@+id/iv_add"
android:layout_toRightOf="@+id/iv_decrease"
android:max="100"
android:maxHeight="10dp"
android:minHeight="10dp"
android:progress="1"
android:progressDrawable="@drawable/seekbar_style"
android:splitTrack="false"
android:thumb="@drawable/bg_shape_cicircle_20dp"></SeekBar>
<!-- 加号图标-->
<ImageView
android:id="@+id/iv_add"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:src="@mipmap/seekbar_add"></ImageView>
</RelativeLayout>
</LinearLayout>
Esto explicará lo que hay dentro:
los dos ImageViews son botones para sumar y restar progreso, no es necesario explicarlo, y luego están las propiedades de SeekBar:
android:max="100" es el valor máximo de la barra de progreso, android: Progress="1" es el actual. Los valores de progreso establecidos
android:maxHeight="10dp" y android:minHeight="10dp" representan el grosor de la barra de progreso,
android:progressDrawable="@drawable/seekbar_style" representa el progreso. estilo propio de la barra. Nota: no incluye deslizamiento El bloque circular,
android:thumb="@drawable/bg_shape_cicircle_20dp" representa el bloque circular al deslizar la barra de progreso, y un estilo se escribe de la siguiente manera:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<gradient
android:endColor="@color/theme_color"
android:startColor="@color/theme_color"></gradient>
<size
android:width="20dp"
android:height="20dp"></size>
</shape>
Casi me olvido de que existe este atributo:
android:splitTrack="false". Puedes encontrarlo comparando las dos imágenes siguientes: si miras
con atención, encontrarás un fondo blanco alrededor del círculo deslizante. Sí, también estaba muy Estaba angustiado en ese momento y no pude encontrar el motivo. Este es el atributo. Simplemente agréguelo y configúrelo en falso.
Finalmente pegue el código:
public class ElevenActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_eleven);
SeekBar seekBar=findViewById(R.id.seekbar);
ImageView iv_decrease=findViewById(R.id.iv_decrease);
ImageView iv_add=findViewById(R.id.iv_add);
// seekBar.getThumb().setColorFilter(Color.BLUE, PorterDuff.Mode.SRC_ATOP);//设置滑块颜色、样式
//
// seekBar.getProgressDrawable().setColorFilter(Color.BLUE, PorterDuff.Mode.SRC_ATOP);//设置进度条颜色、样式
iv_decrease.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//减少
seekBar.setProgress(seekBar.getProgress()-10);
}
});
iv_add.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//增加
seekBar.setProgress(seekBar.getProgress()+10);
}
});
}
}
ok Así es como lo escribo. También puedes buscar otros métodos. Espero que te pueda ayudar.