En muchas ocasiones los componentes ofrecidos por el SDK de Android no son suficientes. Por ésta razón es importante entender como funciona la creación de vistas (Views) con atributos y parámetros personalizables. A continuación les explico en detalle cómo crear un indicador de progreso con círculos que te permite personalizar: color, tamaño de los círculos, número de círculos y el margen de separación entre cada círculo.
Lo primero que debes hacer es crear un nuevo proyecto Android. Una vez tengas el proyecto deberás crear tu archivo de atributos (attrs.xml) en la siguiente ruta res/values/attrs.xml. Dentro de éste archivo crea tu styleable con las propiedades que deseas parametrizar:
Una vez hayas creado el archivo attrs.xml deberás crear una nueva clase que se llame CirclesIndicator que extienda la clase View. Dentro esta clase deberás incluir las variables para almacenar los valores de los parámetros:
Luego deberás crear un objeto Paint que te permitirá dibujar los círculos en el canvas de la vista. De igual manera un objeto Rect para poder medir las dimensiones del canvas y hacer los cálculos de manera correcta.
Una vez tengas tus variables deberás sobrescribir el constructor de la clase View que te permite recibir parámetros. Luego crear un método init en el cual inicialices los objetos de tu vista y otro método loadAttributes en donde leas de la configuración los parámetros correspondientes:
Finalmente deberás sobrescribir los métodos onDraw y onMeasure para dibujar los círculos y medir las dimensiones de tu vista.
Un vez tengas estos dos archivos creados (attrs.xml y CirclesIndicator.java) lo único que deberás hacer para usarlos es incluirlos dentro de tu layout xml de la siguiente manera:
El atributo 'xmlns:custom="http://schemas.android.com/apk/res-auto"' del elemento padre de tu xml le permite a tu IDE detectar los atributos que tu definiste en el archivo attrs.xml. De ésta manera puede validar y previsualizar tu vista:
