🟢Android 22 : Graficar en Android Studio (Canvas,Paint,Shader,SweepGradient)

Bienvenidos a mi Blog el informático Ibero en esta oportunidad tocaremos un Tema de Dibujar en Android Studio. Revisaremos las clases Lienzo, Canvas, Paint, Shader, SweepGradient y algunas funciones del las clases.

¿Para que sirve la Clase Lienzo?

Lienzo es la clase que hereda de Canvas y redefine el paint().

¿Para que sirve la Clase Canvas?

Es un control Apropiado para dibujar en una superficie.

¿Para que sirve la Clase Paint?

Sirve para dibujar su contenido.

¿Para que sirve la Clase Shader?

Sirve para dibujar formas graficas 

¿Qué es SweepGradient ?

Es un constructor de la clase Shader. SweepGradient(float cx, float cy, int[] colors, float[])

Primero creamos el nuevo proyecto en android Studio, revísenlo como hacer el nuevo proyecto en el post Crear nuevo proyecto en Android Studio.

Una vez creado el nuevo proyecto empezamos por eliminar el contenido que se crea al momento de crear el nuevo proyecto y agregamos el id al Layout de la actividad android:id="@+id/layout1".

En la actividad no se realiza ningún diseño porque lo haremos el pintado con el lienzo, una vez realizado el cambio de id del RelativeLayout, empezamos con el código que es lo que se trata este proyecto.

public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 //habilitamos para que se pueda visualizar el action bar
 getSupportActionBar().setDisplayShowHomeEnabled(true);
 //Indicamos donde esta la imagen para el action bar
 getSupportActionBar().setIcon(R.drawable.ic_action_name);
 //Instanciamos el layout con el id de la vista
 RelativeLayout layout1=(RelativeLayout)findViewById(R.id.layout1);
 //objeto de la clase lienzo
 Lienzo fondo =new Lienzo(this);
 //agregamos el fondo al layout
 layout1.addView(fondo); }
 //clase lienzo
 class  Lienzo extends View {
 //Constructor de la clase
 public Lienzo(Context context){ super(context); }
 /*DIbujando*/
 protected void onDraw(Canvas canvas){
 //Canvas lo indicamos los tres colores
 canvas.drawRGB(255,255,255);
 //indicamos el ancho y el largo la cual seria para pintar
 int ancho=canvas.getWidth();
 int largo=canvas.getHeight();
 //Instanciamos a paint para poder pintar
 Paint paint=new Paint();
 //RECTANGULO SUPERIOR
 //Indicamos el Color y lo convertimos
 paint.setColor(Color.parseColor("#231F20"));
 //Indicamos que pinte un rectangulo izquierda,arriba,ancho,abajo,indicamos el color
 canvas.drawRect(0,0,ancho,100,paint);
 // RECTANGULO INFERIOR
 //Indicamos el Color y lo convertimos
 paint.setColor(Color.parseColor("#322F30"));
 //Indicamos que pinte un rectangulo izquierda,arriba,ancho,abajo,indicamos el color
 canvas.drawRect(0,1440,ancho,1540,paint);
 //CIRCULO
 //Agregamos el color al circulo
 paint.setColor(Color.parseColor("#5A1616"));
 //Pintamos x,y radio del circulo,lo indicamos que lo dibuje paint
 canvas.drawCircle(ancho/2,(largo/2)-260,120,paint);
 //Dibujo con Shadeintsnaciamos a SweepGradient
 //Realizamos un arreglo de colores
 int[] colors = {Color.RED, Color.BLUE,Color.GREEN,Color.YELLOW,Color.BLACK};
 //indicamos a shader cx,cy,lista de colores,posicion
 Shader shader = new SweepGradient(ancho/2, (largo/2)+260,colors, null);
 //indicamos que paint guarde a shade
 paint.setShader(shader);
 //Pintamos x,y radio del circulo,lo indicamos que lo dibuje paint
 canvas.drawCircle(ancho/2, (largo/2)+260, 120, paint);
 //Realizamos un arreglo de colores
 colors = new int[]{Color.WHITE, Color.WHITE};
 //indicamos a shader cx,cy,lista de colores,posicio
 shader = new SweepGradient(ancho/2, (largo/2)+260,colors, null);
 //indicamos que paint guarde a shade
 paint.setShader(shader);
 //Pintamos x,y radio del circulo,lo indicamos que lo dibuje paint
 canvas.drawCircle(ancho/2, (largo/2)+260, 90, paint);
 //Realizamos un arreglo de colores
 colors= new int[]{Color.WHITE,Color.BLACK,Color.YELLOW,Color.GREEN,Color.RED,Color.MAGENTA};
 //indicamos a shader cx,cy,lista de colores,posicion
 shader = new SweepGradient(ancho/2, largo/2,colors, null);
 //indicamos que paint guarde a shade
 paint.setShader(shader);
 //Pintamos x,y radio del circulo,lo indicamos que lo dibuje paint
 canvas.drawCircle(ancho/2, largo/2, 120, paint);}}}

Una programado y no tengamos ningún error en el código fuente, empezamos a levantar el emulador para realizar la prueba. Al ejecutar el proyecto tendremos la siguiente vista.

Si les les gusto el contenido de mi blog compártalo con los amigos y pueden comunicarse conmigo para cualquier proyecto, ayúdenme con sus donaciones para seguir creciendo en esta comunidad, Compartan y comenten. 

ABRE EL PROYECTO DIRECTAMENTA DESDE GITHUB

https://github.com/raul1995/DibujoLienzoApp.git

Apoyen suscribiéndose a mi canal de Youtube canal " EL INFORMATICO IBERO" , Compartan el contenido del Blog, si les gusto el contenido del blog y del canal suscribanse es Gratis!!