Desde mi perspectiva, tiene dos caminos para elegir: uno es mucho más avanzado que el otro. Creo que podrás adivinar cuál es cuál.
1. Crear una interfaz de usuario creativa a partir de la interfaz de usuario básica
Con este enfoque, debe familiarizarse con tantos componentes de la interfaz de usuario de Android como sea posible: la vista básica, el botón, la vista de texto, los grupos de diseño, CheckBox, etc.
- ¿Cuáles son las mejores ideas de aplicaciones de Android para principiantes en 2017?
- ¿Qué lleva más tiempo: desarrollo de iPhone o desarrollo de Android?
- ¿Por qué es "fácil de desarrollar" una prioridad para los sistemas operativos de teléfonos inteligentes?
- ¿Cuánto podemos ganar (mínimo y máximo) en el desarrollo de juegos de Android en India?
- ¿Cuál es el estado del desarrollo de aplicaciones de Android en estos días?
Entonces necesita el conocimiento requerido que le permite diseñar estos componentes. Nunca lo sabrá todo, y la biblioteca de soporte continúa agregando componentes más innovadores que simplifican el proceso de diseño. Pero debe conocer los principios detrás de este enfoque: tome algo común -> vuelva a pelarlo para que coincida con su diseño.
Veamos el ejemplo oportuno, esta pantalla en particular:
Voy a desglosar cómo construiría este diseño, en lugar de la implementación exacta porque solo puedo adivinar lo que pienso. 🙂
- TextView estándar con una fuente personalizada y efectos de pintura personalizados que le dan ese brillo blanco.
- Usaría un Android ShapeDrawable personalizado como fondo de este contenedor. Esa forma es Rectángulo, con esquinas ligeramente redondeadas, un borde delgado, cuyo color es ligeramente menos transparente que el color de fondo.
- Usaría un widget SwitchCompat.
- Vistas de texto estándar alineadas en un diseño lineal utilizando la fuente predeterminada de Roboto.
- Construyo divisores usando una clase de Vista simple con un color como fondo. El divisor es probablemente `1dp` de alto y` match_parent` de ancho.
- Un AppCompatCheckbox estándar puede hacer que esto suceda porque podemos asignar texto a cualquier widget CheckBox.
- Finalmente, parece que un Spinner implementaría este aspecto y comportamiento.
Esta vista es hermosa y parece no estándar, pero le garantizo que puede construirla con piezas estándar rediseñadas para que coincidan con sus objetivos de diseño. Se trata de saber qué hay en su caja de herramientas y cómo aplicarlo a la situación dada.
Nunca reinventes la rueda. A no ser que…
2. Cree una interfaz de usuario creativa ampliando la vista
No todo en Timely se construye fácilmente con piezas existentes disponibles en el mercado. Veamos este pequeño y elegante elemento:
Sé que algunos desarrolladores discutirán conmigo sobre este punto, y es válido afirmar que técnicamente puedes construir esto con partes nativas. Y tal vez Timely tomó ese enfoque, pero supongamos que decidieron dibujarlo ellos mismos.
¿Cómo se hace esto? Cada widget listo para usar en Android se reduce a una vista. Y una vista se dibuja en un objeto Canvas. Tanto Google como Apple quitan un montón de estrés a los desarrolladores al proporcionar todos estos componentes de interfaz de usuario listos para usar.
Lo que sucede debajo es una serie compleja de funciones de cálculo de píxeles y dibujo sin procesar que realmente colocan los colores en la pantalla y reaccionan adecuadamente a la entrada táctil. View y sus subclases manejan estas responsabilidades y te ocultan la lógica de fusión de la cara nazi. (Haz clic si te atreves).
Entonces, ¿cómo crearía esta vista de escala de tiempo creciente? Lo llamaría GrowyTimeScaleyView y comenzaría extendiendo la clase View. A partir de ahí, se trata de anular `onDraw`, obtener los límites de altura / ancho de la vista y dibujar manualmente los pequeños ticks y números.
La clase también necesitaría aceptar cambios de usuarios externos con un método como, `setSelectedTime (mucho tiempo)`. `time` oscilaría entre` 0` y `86400000`, el número de milisegundos en un día.
Usaría este valor para determinar dónde ampliar los ticks y los números usando un poco de matemática de píxeles exponencial que crece a medida que se acerca el tiempo seleccionado y se reduce a un tamaño mínimo a medida que me alejo.
Aquí hay algunos tutoriales que lo ayudarán a comenzar a dibujar vistas personalizadas:
- Dibujo personalizado | Desarrolladores de Android
- Vistas personalizadas de Android: el método onDraw
- Sabiduría local | Crear una implementación de vista personalizada en Android
- Crear vistas personalizadas y compuestas en Android – Tutorial
- Tutorial de vista personalizada de Android 2 – Atributos personalizados, dibujo, medición
Como habrás adivinado, la opción 2 es mucho más difícil y generalmente involucra matemática avanzada y mucha depuración. Dicho esto, la opción 2 probablemente resultará en una mejora del rendimiento sobre un enfoque que requiere que muchos componentes listos para usar trabajen juntos de una manera altamente compleja.
¡Gracias por leer! Si te ha resultado útil, ¡ vota y siéntete libre de seguirme para obtener más respuestas sobre Android y otras cosas divertidas!
Alcance, soy todo oídos: correo electrónico y twitter .
