[ CONSULTA ] Webviem con menu

isaaclg · 02/12/12, 03:51:50

Buenas.

Antes comentarios que de programacion se bien poco, casi nada.
Me informe y es posible crear una aplicacion usando un "webview" que lo que hara sera llamar a la URL que tu quieras. Como mi web tiene version para moviles, pense usar esa version tambien para crear una APK.

Mi pregunta es, se podria poner un menu en el webview? Mi intencion es poner algunos botones en ese menu y que al hacer click en ellos lleve a una pagina u otra.

Saludos

**kriogeN** · 02/12/12, 09:16:45

Un WebView es un componente como cualquier otro, puedes tener un WebView en la pantalla y al mismo tiempo también lo que quieras.

Si te refieres a que si puedes crear un Menú que se despliegue al pulsar la tecla de Menú, si puedes hacerlo.

isaaclg · 02/12/12, 18:45:57

Hola.

Si, me refiero a eso. Hay muchas webs online desde las que puedes crearte una aplicacion sencilla con un webview y ponerle un menu, adjunto una imagen. Lo que yo quiero es hacer algo asi, pero yo, desde eclipse. El webview esta ya creado y funcionando, pero no consigo poner un menu asi. He buscado en internet y no veo codigos de ejemplo. Alguien sabe como es?

Enviado desde mi Samsung Galaxy S3

superroko2 · 02/12/12, 23:09:01

Si no me confundo este tipo de menú es un LinearLayout arriba y un TabHost con Activities independientes abajo, cierto?

Que algún experto me corrija, que yo también estoy empezando.

isaaclg · 03/12/12, 17:55:02

He estado echando un ojo a lo de crear TabHost. Si parece que son esos menos a los que yo me refiero, he visto algunos ejemplos en internet.

Lo que no he visto, es lo siguiente. ¿Como se haria para que un boton de estos, apunte a una URL webview? Mi idea es poner un menu con 4 ó 5 opciones y que al hacer click, cada uno acceda a una url pero que se siga viendo el menu. Mas o menos como en la captura que envie, pero eso esta creado a traves de una empresa de estas de creacion de aplicaciones online.

Alguien sabe como hacerlo?

superroko2 · 04/12/12, 09:47:42

Cita:

Originalmente Escrito por isaaclg

He estado echando un ojo a lo de crear TabHost. Si parece que son esos menos a los que yo me refiero, he visto algunos ejemplos en internet.

Lo que no he visto, es lo siguiente. ¿Como se haria para que un boton de estos, apunte a una URL webview? Mi idea es poner un menu con 4 ó 5 opciones y que al hacer click, cada uno acceda a una url pero que se siga viendo el menu. Mas o menos como en la captura que envie, pero eso esta creado a traves de una empresa de estas de creacion de aplicaciones online.

Alguien sabe como hacerlo?

Con un TabHost y que cada Activity del TabHost sea un WebView con dicha URL y incluso creo que podrías aprovechar la misma Activity y usar los botones simplemente para cambiar la URL y recargar el WebView.

Sinceramente me estoy iniciando en todo esto, pero yo lo haría así.

isaaclg · 04/12/12, 11:10:00

Cita:

Originalmente Escrito por superroko2

Con un TabHost y que cada Activity del TabHost sea un WebView con dicha URL y incluso creo que podrías aprovechar la misma Activity y usar los botones simplemente para cambiar la URL y recargar el WebView.

Sinceramente me estoy iniciando en todo esto, pero yo lo haría así.

Gracias por responder.

Podrias poner un ejemplo del codigo?

superroko2 · 04/12/12, 12:12:51

Cita:

Originalmente Escrito por isaaclg

Gracias por responder.

Podrias poner un ejemplo del codigo?

Estoy en la Universidad. Esta tarde tengo que trabajar en una App que usa TabHosts, aprovecharé para colgarte el código. Luego edito.

Un saludo ;)

isaaclg · 04/12/12, 13:04:55

Cita:

Originalmente Escrito por superroko2

Estoy en la Universidad. Esta tarde tengo que trabajar en una App que usa TabHosts, aprovecharé para colgarte el código. Luego edito.

Un saludo ;)

Ok perfecto, muchas gracias

oscar8x · 05/12/12, 23:14:22

Yo estoy desarrollando una cosa similar y como te comentan podrías arreglar todo con 1 tabhost, 1 Activity y un Webviews.

Mira esto (WebView): http://www.tutorialandroid.com/basic...ar-un-webview
Y esto (Tabs): http://www.sgoliver.net/blog/?p=2112

No te olvides de poner en el manifest para habilitar Internet, sino nunca te responderían las páginas.

Básicamente del tutorial de Tabs sustituyes los TextView dentro de Tab1 y Tab2 por WebView en el archivo XML del layout y luego en el código asocias cada webview a una url que cuando cargues dicho Frame del Tab ya aparecerá.

El caso que la aplicación tiene que controlar bastantes cosas, por ejemplo, tienes que reescribir métodos de la clase padre, ya que por ejemplo, si pinchas en un enlace de la web que cargues puede que te abra un navegador y tu quieres que se navegue siempre en tu app. Son cosas simples, pero tienes que leer.

isaaclg · 06/12/12, 01:55:12

Cita:

Originalmente Escrito por oscar8x

Yo estoy desarrollando una cosa similar y como te comentan podrías arreglar todo con 1 tabhost, 1 Activity y un Webviews.

Mira esto (WebView): http://www.tutorialandroid.com/basic...ar-un-webview
Y esto (Tabs): http://www.sgoliver.net/blog/?p=2112

No te olvides de poner en el manifest para habilitar Internet, sino nunca te responderían las páginas.

Básicamente del tutorial de Tabs sustituyes los TextView dentro de Tab1 y Tab2 por WebView en el archivo XML del layout y luego en el código asocias cada webview a una url que cuando cargues dicho Frame del Tab ya aparecerá.

El caso que la aplicación tiene que controlar bastantes cosas, por ejemplo, tienes que reescribir métodos de la clase padre, ya que por ejemplo, si pinchas en un enlace de la web que cargues puede que te abra un navegador y tu quieres que se navegue siempre en tu app. Son cosas simples, pero tienes que leer.

Hola.

El webview lo tengo ya hecho, pero carga en la pagina principal nada mas entrar en la aplicacion. Mi idea es crear un submenu como en la foto que puse mas arriba, y que al hacer click sobre las opciones, lleven a una web u otra.
Como dije, lo del webview ya lo consegui hacer, pero me falta lo del menu, y que cada boton o enlace lleve a una web.

Voy a echar un ojo al segundo enlace que has puesto, a ver si consigo hacerlo funcionar.

Gracias

superroko2 · 06/12/12, 15:44:48

Lo siento por el retraso, estoy super liado con curro y estudios. De momento te paso este enlace que creo que te puede servir de mucho.

http://androideity.com/2012/02/13/pe...sando-eclipse

Este enlace también tiene una segunda parte (ya lo verás) que complementa más aún lo de las pestañas y demás.

Si tienes dudas concretas no dudes en preguntar, si quieres que te haga un código de ejemplo con lo que tu pides, puedo, pero hasta dentro de un par de días o así no podré.

Un saludo ;)

isaaclg · 06/12/12, 17:06:04

oscar8x en el manual de las tabs, este codigo:

Código:

Resources res = getResources();
 
TabHost tabs=(TabHost)findViewById(android.R.id.tabhost);
tabs.setup();
 
TabHost.TabSpec spec=tabs.newTabSpec("mitab1");
spec.setContent(R.id.tab1);
spec.setIndicator("TAB1",
        res.getDrawable(android.R.drawable.ic_btn_speak_now));
tabs.addTab(spec);
 
spec=tabs.newTabSpec("mitab2");
spec.setContent(R.id.tab2);
spec.setIndicator("TAB2",
        res.getDrawable(android.R.drawable.ic_dialog_map));
tabs.addTab(spec);
 
tabs.setCurrentTab(0);

En que fichero hay que ponerlo? Ayer estuve probando un poquillo y no me salia.

superroko2 gracias por ese manual, lo habia visto, pero lo malo es que los ejemplos que vienen son imagenes, y no se pueden copiar y pegar en eclipse.
Gracias por el ofrecimiento de hacerme un codigo, pero antes prefiero probar yo a ver si me sale y asi voy aprendiendo poco a poco.

superroko2 · 06/12/12, 20:23:18

Creo que no sé que quieres exactamente. En tu captura también hay imágenes no?

Facebook, noticias, etc..

Si lo que quieres es hacer una barra como la superior ("Tu Web"). Entonces puedes crear un simple LinearLayout encima del WebView con un TextView y un par de Buttons con esas imágenes.

Si lo que quieres es hacer la parte central, entonces debes hacer una lista con un estilo personalizado con Texto y Foto y rellenarlo con los datos que quieras.

De ahí en adelante, no sé exactamente que no sabes hacer.

Si me concretas, podré ayudarte.

isaaclg · 07/12/12, 00:46:33

La captura es, un menu inferior donde salen los botones de facebook y demas, cada uno con un icono.
Al hacer click en esos menus, llevan directamente a una pagina web. Lo que se ve en el centro es ya la web. Si hago click en el boton de facebook me llevaria a otra web que yo ya configuraria la url. Con el resto de botones igual, simplemente llevan a webs.

Yo lo unico que hice fue el codigo para que al abrir la aplicacion, cargue ya una web. Lo que no se hacer es la barra del menu inferior y que al hacer click en cada boton, lleven a una u otra web.

superroko2 · 07/12/12, 12:43:14

Vale. Entonces debes seguir el tutorial que te pasé. Ese es un ejemplo muy básico que te pone simplemente un TextView para ver el ejemplo.

Lo que debes hacer es en cada "Pestana" (te hablo del tutorial) añadir un WebView, cada uno redireccionado a la URL que quieras.

Si ya sabes como trabajar con WebViews no deberías tener problemas. El tutorial te explica como hacer el menú y luego cada pestaña corresponde a una Activity diferente. Igual que has hecho lo que tienes ahora, hazlo cuatro veces más con diferentes URL.

Que dudas tienes?

isaaclg · 12/12/12, 01:37:05

A ver, esto es lo que tengo hecho, exporto la APK y directamente me carga la URL que le puse, os pongo el codigo.

Archivo MainActivity.java:

Código:

package com.example.pesoccerworld;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ProgressBar;
     
    @SuppressLint("SetJavaScriptEnabled")
    public class MainActivity extends Activity {
    
        private WebView browser;
     
        private ProgressBar progressBar;
            
        @Override
        public void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
     
            browser = (WebView)findViewById(R.id.webkit);
             
                     //habilitamos javascript y el zoom
            browser.getSettings().setJavaScriptEnabled(true);
            browser.getSettings().setBuiltInZoomControls(true);
     
            browser.loadUrl("http://a.pesoccerworld.com");
             
            browser.setWebViewClient(new WebViewClient()
            {
                            // evita que los enlaces se abran fuera nuestra app en el navegador de android
                @Override
                public boolean shouldOverrideUrlLoading(WebView view, String url)
                {
                    return false;
                }  
                 
            });
     
            progressBar = (ProgressBar) findViewById(R.id.progressbar);
             
            browser.setWebChromeClient(new WebChromeClient()
            {
                @Override
                public void onProgressChanged(WebView view, int progress)
                {              
                    progressBar.setProgress(0);
                    progressBar.setVisibility(View.VISIBLE);
                    MainActivity.this.setProgress(progress * 1000);
     
                    progressBar.incrementProgressBy(progress);
     
                    if(progress == 100)
                    {
                        progressBar.setVisibility(View.GONE);
                    }
                }
            });
        }  
     
    
    //simula el comportamiento del botón Back en el navegador de Android
    @Override
    public void onBackPressed()
    {
        if (browser.canGoBack())
        {
            browser.goBack();
        }
        else
        {
            super.onBackPressed();
        }
    }}

Archivo /res/layout/activity_main.xml

Código:

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

            <ProgressBar
                android:id="@+id/progressbar"
                style="@style/AppTheme"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_margin="3dp"
                android:visibility="gone" />
             
        <WebView
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/webkit"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"/>
        
    </LinearLayout>

Luego tengo puesto eso para que acceda a internet, en el otro fichero.
Con esto que tengo, al abrir la app me entra directamente en la web.

La idea es tener un menu abajo, con 2, 3, 4 los links que sean, y que al hacer click cargue una url.

Con los manuales me hago un poco un lio, a ver si diciendo esto que tengo, es mas facil y me podeis decir donde poner el codigo para el menu.

Gracias

Menu