Cicklow
Seguir
- Seguidores
- 20
Admin
Dseda
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
¡Ha verificado su Paypal!
¡Usuario popular!
Suscripción a IA
- Desde
- 30 May 2011
- Mensajes
- 1.101
Buenas en este tutorial aprenderán como crear una aplicación Android (programando en java) para visualizar imágenes / memes / imágenes de amor / imágenes sexy, etc... y un laaargo etc... XD
Usaremos eclipse: https://www.eclipse.org/downloads/
SDK Android: https://developer.android.com/sdk/index.html?hl=sk
Google Play Service (AdMob): https://developers.google.com/mobile-ads-sdk/download (El viejo SDK de admob no sirve mas para nuevas apps)
Capturas:
Solo explicare como programar la aplicación, si ven el código de la misma van a ver que tiene 4 clases mas, que son para leer imágenes remotas, guardarlas como cache en el celular o la memoria.
Paso 1 - Crear proyecto
File->New->Project->Android Aplication Project
Configuramos nuestra aplicación para usar estos parámetros:
Y la actividad (el diseño) sera en blanco:
Paso 2 - Agregamos los objetos necesarios a nuestro diseño
Tenemos que agregar un TextView y un Button. El textview tendra la propiedad graviti: center_horizontal, esto hace que el texto se centre horizontalmente.
Creamos un nuevo diseño (layout), boton derecho arriba de nuestro proyecto->New->Other->Android Activity, y agregamos estos objetos:
El imageview tendrá como imagen el objeto: loader
Los botones son para movernos entre imágenes y el textview sera para mostrar la imagen actual y cuantos son en total, ejemplo 1 de 4
Paso 3 - Programar
Editamos MainActivity.java
Editamos VerImagenes.java
Paso 5 - Archivo Remoto
El archivo que contiene las imagenes se alojara en un server remoto y tiene estas caracteristicas:
Ejemplo:
Acá podrán agregar la cantidad de imágenes a mostrar!
Paso 6 - Sin Archivo Remoto
Si no tienen donde alojar este archivo, pueden editar la aplicación para que contenga el listado de imagenes a mostrar.
Buscan en VerImagenes.java:
Y lo cambian por:
De esta forma no usan archivos externos, pero si quieren cambiar imagenes tendran que actualizar la aplicacion y enviarla nuevamente.
Paso 7 - TIPS
- Pueden hacer que cuendo vea X cantidad de imagenes mostrar un banner de admob a pantalla completa (ejemplo si vio 5 imágenes mostrar esa publicidad: InterstitialAd | Android Developers)
- Pueden crear varios layout mas y varios botones al inicio de la aplicacion, y que cada boton cargue un layout distinto y ese layout carga una url distinta, entonces pueden hacer una apps con varias tematicas de imagenes.
- Pueden cambiar todo el diseño para que sea mucho mas bonito, o cambiar de logares los botones, las publicidades mas grandes o no.
- Pueden usar un server free para alojar el archivo que contiene el listado de imagenes.
Descarga:
(Tienen que ir a new->project->from existing project)
Git:
NO Citen el post... ya que si hay ediciones queda todo descujeringado y desactualizado en las citas.
PD: El ejemplo es basico cualquier mod y demas corren por cuenta de ustedes, pero no duden en preguntar cualquier cosa
Si hacen modificaciones también agregenla en este post para que otros usuarios vean
PD: Para editar el ID de publicidad solo tienen que editar res->values->strings.xml->idADS :encouragement: y crean su publicidad desde: https://apps.admob.com/#home
La idea de este tutorial es que aprendan! - Saludos! :encouragement:
Usaremos eclipse: https://www.eclipse.org/downloads/
SDK Android: https://developer.android.com/sdk/index.html?hl=sk
Google Play Service (AdMob): https://developers.google.com/mobile-ads-sdk/download (El viejo SDK de admob no sirve mas para nuevas apps)
Capturas:
Solo explicare como programar la aplicación, si ven el código de la misma van a ver que tiene 4 clases mas, que son para leer imágenes remotas, guardarlas como cache en el celular o la memoria.
Paso 1 - Crear proyecto
File->New->Project->Android Aplication Project
Configuramos nuestra aplicación para usar estos parámetros:
Y la actividad (el diseño) sera en blanco:
Paso 2 - Agregamos los objetos necesarios a nuestro diseño
Tenemos que agregar un TextView y un Button. El textview tendra la propiedad graviti: center_horizontal, esto hace que el texto se centre horizontalmente.
Creamos un nuevo diseño (layout), boton derecho arriba de nuestro proyecto->New->Other->Android Activity, y agregamos estos objetos:
El imageview tendrá como imagen el objeto: loader
Los botones son para movernos entre imágenes y el textview sera para mostrar la imagen actual y cuantos son en total, ejemplo 1 de 4
Paso 3 - Programar
Editamos MainActivity.java
PHP:
package com.imagenescopadas;
import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.view.View;
public class MainActivity extends Activity {
[MENTION=42437]over[/MENTION]ride
protected void onCreate(Bundle savedInstanceState) {
//Encargado de cargar el diseño a esta clase java
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
//Funcion encargada de cargar el layout para ver las imagenes, al hacer click en el boton!
public void CargarImagenes(View view){
Intent intent = new Intent(this, VerImagenes.class);
startActivity(intent);
}
}
Editamos VerImagenes.java
PHP:
package com.imagenescopadas;
import java.io.IOException;
import org.apache.http.HttpEntity;
import org.apache.http.HttpResponse;
import org.apache.http.client.ClientProtocolException;
import org.apache.http.client.HttpClient;
import org.apache.http.client.methods.HttpGet;
import org.apache.http.impl.client.DefaultHttpClient;
import org.apache.http.util.EntityUtils;
import com.google.android.gms.ads.AdRequest;
import com.google.android.gms.ads.AdView;
import android.os.AsyncTask;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;
import android.app.Activity;
import android.content.Context;
public class VerImagenes extends Activity {
//Creamos nuestras variables
HttpResponse response;
String resultado;
private AdView adView;
String[] Imagenes;
Context context;
int loader = R.drawable.loader;
int CantImg = 0;
[MENTION=42437]over[/MENTION]ride
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.ver_imagenes);
context = getApplicationContext();
// Cargamos la publicidad de AdMob y la mostramos
AdView adView = (AdView)this.findViewById(R.id.adView);
AdRequest adRequest = new AdRequest.Builder().build();
adView.loadAd(adRequest);
//Cargamos listado de imagenes desde una url
new MyAsyncTask().execute("");
}
//Boton ir atras
public void IrAtras(View view){
CantImg--;
if(CantImg<0) CantImg=0; else LoadImg();
}
//Boton ir adelante
public void IrAdelante(View view){
CantImg++;
if(CantImg>(Imagenes.length-1)) CantImg--; else LoadImg();
}
//Mostrar imagen en pantalla
public void LoadImg(){
Log.e("CantImg:",""+CantImg);
//Cargamos el objeto imageview
ImageView image = (ImageView) findViewById(R.id.imageView1);
//Cargamos la imagen desde el indice
String image_url = Imagenes[CantImg];
//Usamos la clase imageloader para cargar imagenes remotas y crear cache
ImageLoader imgLoader = new ImageLoader(context);
//Mostramos la imagen
imgLoader.DisplayImage(image_url, loader, image);
//Cargamos el objeto textview y le asignamos la imagen actual y la cantidad total
TextView txt = (TextView) findViewById(R.id.textView1);
txt.setText((CantImg+1) + " de " + Imagenes.length);
}
//Cargar listado de imagenes
private class MyAsyncTask extends AsyncTask<String, Integer, Double>{
[MENTION=42437]over[/MENTION]ride
protected Double doInBackground(String... params) {
// TODO Auto-generated method stub
postData();
return null;
}
protected void onPostExecute(Double result){
//Toast.makeText(getApplicationContext(), "Cargando...", Toast.LENGTH_LONG).show();
Log.e("Termino:","1");
}
protected void onProgressUpdate(Integer... progress){
//Progreso
}
public void postData() {
// Creamos un nuevo cliente htttp y leemos nuestra url
HttpClient httpclient = new DefaultHttpClient();
HttpGet httppost = new HttpGet("http://192.168.0.100/testandroid.php");
try {
// Ejecutamos la accion y obtenemos el resultado
response = httpclient.execute(httppost);
HttpEntity httpEntity = response.getEntity();
resultado = EntityUtils.toString(httpEntity);
Log.e("Resultado: ",""+resultado);
Imagenes = resultado.split("#-#");
Log.e("Imagen:",""+ Imagenes[0]);
//Creamos un thread para no matar la aplicacion (la aplicacion esta tardando demaciado tiempo bla bla bla)
runOnUiThread(new Runnable() {
[MENTION=42437]over[/MENTION]ride
public void run() {
//Cargamos la imagen numero 0, la 1 imagen
ImageView image = (ImageView) findViewById(R.id.imageView1);
String image_url = Imagenes[0];
ImageLoader imgLoader = new ImageLoader(context);
imgLoader.DisplayImage(image_url, loader, image);
TextView txt = (TextView) findViewById(R.id.textView1);
txt.setText((CantImg+1) + " de " + Imagenes.length);
}
});
} catch (ClientProtocolException e) {
// TODO Auto-generated catch block
} catch (IOException e) {
// TODO Auto-generated catch block
}
}
}
//Recargamos la ads
[MENTION=42437]over[/MENTION]ride
public void onResume() {
super.onResume();
if (adView != null) {
adView.resume();
}
}
//Pausamos las ads
[MENTION=42437]over[/MENTION]ride
public void onPause() {
if (adView != null) {
adView.pause();
}
super.onPause();
}
/** eliminamos las ads. */
[MENTION=42437]over[/MENTION]ride
public void onDestroy() {
// Destroy the AdView.
if (adView != null) {
adView.destroy();
}
super.onDestroy();
}
}
Paso 5 - Archivo Remoto
El archivo que contiene las imagenes se alojara en un server remoto y tiene estas caracteristicas:
Insertar CODE, HTML o PHP:
imagen url#-#imagen url#-#imagen url
Insertar CODE, HTML o PHP:
http://meme-lol.com/wp-content/uploads/2013/08/Can-you-see-it-meme.jpg#-#http://www.memegenerator.es/imagenes/memes/13/995238.jpg#-#http://cdn.memegenerator.net/instances/500x/43648499.jpg#-#http://weknowmemes.com/wp-content/uploads/2013/02/this-isnt-a-meme.jpg
Paso 6 - Sin Archivo Remoto
Si no tienen donde alojar este archivo, pueden editar la aplicación para que contenga el listado de imagenes a mostrar.
Buscan en VerImagenes.java:
PHP:
new MyAsyncTask().execute("");
PHP:
resultado = "http://meme-lol.com/wp-content/uploads/2013/08/Can-you-see-it-meme.jpg#-#http://www.memegenerator.es/imagenes/memes/13/995238.jpg#-#http://cdn.memegenerator.net/instances/500x/43648499.jpg#-#http://weknowmemes.com/wp-content/uploads/2013/02/this-isnt-a-meme.jpg";
Imagenes = resultado.split("#-#");
runOnUiThread(new Runnable() {
[MENTION=42437]over[/MENTION]ride
public void run() {
ImageView image = (ImageView) findViewById(R.id.imageView1);
String image_url = Imagenes[0];
ImageLoader imgLoader = new ImageLoader(context);
imgLoader.DisplayImage(image_url, loader, image);
TextView txt = (TextView) findViewById(R.id.textView1);
txt.setText((CantImg+1) + " de " + Imagenes.length);
}
});
Paso 7 - TIPS
- Pueden hacer que cuendo vea X cantidad de imagenes mostrar un banner de admob a pantalla completa (ejemplo si vio 5 imágenes mostrar esa publicidad: InterstitialAd | Android Developers)
- Pueden crear varios layout mas y varios botones al inicio de la aplicacion, y que cada boton cargue un layout distinto y ese layout carga una url distinta, entonces pueden hacer una apps con varias tematicas de imagenes.
- Pueden cambiar todo el diseño para que sea mucho mas bonito, o cambiar de logares los botones, las publicidades mas grandes o no.
- Pueden usar un server free para alojar el archivo que contiene el listado de imagenes.
Descarga:
Insertar CODE, HTML o PHP:
http://test.cicklow.me/ImagenesCopadas.rar
Git:
Insertar CODE, HTML o PHP:
https://github.com/cicklow/ImagenesCopadas
NO Citen el post... ya que si hay ediciones queda todo descujeringado y desactualizado en las citas.
PD: El ejemplo es basico cualquier mod y demas corren por cuenta de ustedes, pero no duden en preguntar cualquier cosa
Si hacen modificaciones también agregenla en este post para que otros usuarios vean
PD: Para editar el ID de publicidad solo tienen que editar res->values->strings.xml->idADS :encouragement: y crean su publicidad desde: https://apps.admob.com/#home
La idea de este tutorial es que aprendan! - Saludos! :encouragement:
Última edición: