Ir al contenido principal

Slider Básico en GWT

Usado en: www.develtrex.com

Bueno esto lo hice a raíz de no encontrar una implementación de un slider con código nativo GWT. Espero que puedan mejorarlo, lo que hice fue aprovecharme de las funcionalidades de los paneles que nos brinda el google web toolkit, he creado una clase que crea un objeto, en este caso es objeto es el slider, bueno espero les sirva y lo mejoren.

Pueden crear cuanto slider e imagenes en el slider quieren usar.

Clase para crear Objetos Slider:

package com.develtrex.website.view;

import java.util.ArrayList;
import java.util.Iterator;
import java.util.List;

import com.develtrex.website.image.WebSiteImagen;
import com.google.gwt.dom.client.Style;
import com.google.gwt.dom.client.Style.Unit;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.Timer;
import com.google.gwt.user.client.ui.DeckPanel;
import com.google.gwt.user.client.ui.FlowPanel;
import com.google.gwt.user.client.ui.Image;
import com.google.gwt.user.client.ui.Label;

public class Slider extends FlowPanel{
    private DeckPanel panelSlider=new DeckPanel();
    private Label nextLeft=new Label();
    private Label nextRight=new Label();
    private List<Image> listImage;
    private Timer timer;
    public Slider(ArrayList<Image> imagenes){
        listImage=imagenes;
        initComponents();
    }  
   
    private void initComponents(){
        this.add(nextLeft);
        this.add(panelSlider);
        this.add(nextRight);      
        panelSlider.setAnimationEnabled(true);
        Iterator<Image> i=listImage.iterator();
        while(i.hasNext()){
            panelSlider.add(i.next());                  
        }
        panelSlider.showWidget(0);
        stlSlider();
        stlDeckPanel();
        stlNextLeft();
        stlNextRigth();
        nextLeft.addClickHandler(click);
        nextRight.addClickHandler(click);
        timer=new Timer(){
            @Override
            public void run() {
                // TODO Auto-generated method stub
                int index = panelSlider.getVisibleWidget();
                index++;
                if (index == panelSlider.getWidgetCount()) index = 0;
                panelSlider.showWidget(index);
            }          
        };
        timer.scheduleRepeating(5000);
    }
   
    ClickHandler click=new ClickHandler(){

        @Override
        public void onClick(ClickEvent event) {
            if(event.getSource().equals(nextLeft)){
                int tamanno=listImage.size();
                int indexActual=panelSlider.getVisibleWidget();
                if(indexActual==0){
                    panelSlider.showWidget(tamanno-1);
                }else{
                    panelSlider.showWidget(indexActual-1);
                }
            }else if(event.getSource().equals(nextRight)){
                int tamanno=listImage.size();
                int indexActual=panelSlider.getVisibleWidget();
                if(indexActual==tamanno-1){
                    panelSlider.showWidget(0);
                }else{
                    panelSlider.showWidget(indexActual+1);
                }
            }
        }
      
    };
   
    private void stlNextLeft(){
        nextLeft.getElement().getStyle().setWidth(10,Unit.PCT);
        nextLeft.getElement().getStyle().setHeight(100,Unit.PCT);
        nextLeft.getElement().getStyle().setFloat(Style.Float.LEFT);
        nextLeft.getElement().getStyle().setProperty("background", "url("+WebSiteImagen.INSTANCE.getBack().getSafeUri().asString()+") no-repeat scroll 0% 0% transparent");
        nextLeft.getElement().getStyle().setProperty("backgroundPosition","center");
        nextLeft.getElement().getStyle().setBorderWidth(0, Unit.PX);
        nextLeft.getElement().getStyle().setFontSize(30, Unit.PX);
    }
   
    private void stlNextRigth(){
        nextRight.getElement().getStyle().setWidth(10,Unit.PCT);
        nextRight.getElement().getStyle().setHeight(100,Unit.PCT);
        nextRight.getElement().getStyle().setFloat(Style.Float.LEFT);
        nextRight.getElement().getStyle().setProperty("background", "url("+WebSiteImagen.INSTANCE.getNext().getSafeUri().asString()+") no-repeat scroll 0% 0% transparent");
        nextRight.getElement().getStyle().setProperty("backgroundPosition","center");
        nextRight.getElement().getStyle().setBorderWidth(0, Unit.PX);
        nextRight.getElement().getStyle().setFontSize(30, Unit.PX);
    }
   
    private void stlSlider(){
        this.getElement().getStyle().setWidth(100,Unit.PCT);
        this.getElement().getStyle().setHeight(100,Unit.PCT);
        this.getElement().getStyle().setMargin(0, Unit.PX);      
        this.getElement().getStyle().setPadding(0, Unit.PX);
        this.getElement().getStyle().setBorderWidth(0, Unit.PX);
    }
   
    private void stlDeckPanel(){
        panelSlider.getElement().getStyle().setWidth(80,Unit.PCT);
        panelSlider.getElement().getStyle().setHeight(100,Unit.PCT);
        panelSlider.getElement().getStyle().setFloat(Style.Float.LEFT);
    }
   
   
   
    //Getters y Setters
   
    public DeckPanel getPanelSlider() {
        return panelSlider;
    }

    public void setPanelSlider(DeckPanel panelSlider) {
        this.panelSlider = panelSlider;
    }
    public List<Image> getListImage() {
        return listImage;
    }

    public void setListImage(List<Image> listImage) {
        this.listImage = listImage;
    }

    public Label getNextLeft() {
        return nextLeft;
    }

    public void setNextLeft(Label nextLeft) {
        this.nextLeft = nextLeft;
    }

    public Label getNextRight() {
        return nextRight;
    }

    public void setNextRight(Label nextRight) {
        this.nextRight = nextRight;
    }

    public Timer getTimer() {
        return timer;
    }

    public void setTimer(Timer timer) {
        this.timer = timer;
    }

    public ClickHandler getClick() {
        return click;
    }

    public void setClick(ClickHandler click) {
        this.click = click;
    }
   
}



Usando la el objeto slider:

package com.develtrex.website.view;

import java.util.ArrayList;

import com.google.gwt.dom.client.Style.Unit;
import com.google.gwt.user.client.ui.Image;
import com.google.gwt.user.client.ui.TabLayoutPanel;

public class TabSliderHome extends TabLayoutPanel{
    private Slider sldTecnology;
    private Image imgGoogleApps=new Image("http://tecnologyc.com/wp-content/2011/01/google_apps.jpg");
    private Image imgCentos=new Image("http://www.dacostabalboa.com/es/imagenes/CentOS-5.6.jpg");
    private Image imgRedHat=new Image("http://blog.linuxlatinamerica.com/wp-content/uploads/2011/10/redhat-logo.jpg");
    private Image imgUbuntu=new Image("http://web.educastur.princast.es/proyectos/grupotecne/archivos/tic/144ubuntu.jpg");
    public TabSliderHome(double barHeight, Unit barUnit) {
        super(barHeight, barUnit);
        // TODO Auto-generated constructor stub
        initComponents();
    }
   
    private void initComponents(){
        this.setAnimationDuration(1000);
        ArrayList<Image> images=new ArrayList<Image>();
        images.add(imgGoogleApps);
        images.add(imgCentos);
        images.add(imgRedHat);
        images.add(imgUbuntu);
        sldTecnology=new Slider(images);
        this.add(sldTecnology,"Tecnología");
        stlTabSliderHome();
    }
   
    private void stlTabSliderHome(){
        this.getElement().getStyle().setWidth(100,Unit.PCT);
        this.getElement().getStyle().setHeight(95,Unit.PCT);
        this.getElement().getStyle().setMargin(5, Unit.PX);       
        this.getElement().getStyle().setPadding(0, Unit.PX);
        this.getElement().getStyle().setBorderWidth(0, Unit.PX);
       
    }

}




Comentarios

Entradas más populares de este blog

Conexion JDBC - JAVA a travès de un archivo Properties

Para conectar a bases de datos con el archivo properties necesitas definir la siguiente estructura:

Rutas de los Archivos Properties, es esas rutas tienes que haber creado tus archivos properties:

package com.develtrex.util;
import java.net.URL;
/**
 *
 * @author 007M
 */
public class Ruta {
    private final String dbOracle="/com/develtrex/propiedad/dboracle.properties";
    private final String dbMysql="/com/develtrex/propiedad/dbmysql.properties";
    private final String dbPostgres="/com/develtrex/propiedad/dbpostgres.properties";
    private final String dbSqlServer="/com/develtrex/propiedad/dbsqlserver.properties";

    public URL getFileDbOracle(){
        return getClass().getResource(dbOracle);
    }

    public URL getFileDbMysql(){
        return getClass().getResource(dbMysql);
    }

    public URL getFileDbPostgres(){
        return getClass().getResource(dbPostgres);
    }

    public URL getFileDbSqlServer(){
        return getClass…

El acta de constitución para proyectos de desarrollo software Ágil o Clásico

Cualquier proyecto de software debe tener un documento que permita formalizar el inicio de un proyecto.
Aquí proporciono un ejemplo.
Debes saber que el acta es un documento incremental que algunas secciones se van actualizando cuando se van realizando las actividades que permiten completarlas.

Información general
Enunciado del proyecto: DOCUMENTO ET. ID del proyecto: SCMF Sponsor: JNE Representante del sponsor:


Interesados del proyectoCargo Nombre/Organización Teléfono E-mail Representante del Sponsor


Program Manager

Project Manager


Empresa Asociada JURADO NACIONAL DE ELECCIONES


Usuario ò Cliente FISCALIZADORES










Instalando Oracle SQL Developer 4.x en CentOS 7

Saludos. Soy @jofrantoba. En este post de enseñare a instalar Oracle SQL Developer 4.x en CentOS 7.Paso 1: Ir a la pagina de Oracle, especificamente al producto Oracle SQL Developer 4.xhttp://www.oracle.com/technetwork/developer-tools/sql-developer/overview/index-097090.htmlPaso 2: Dar click en "Download" y en la página seleccionar el paquete RPM que se muestra a continuación:Paso 3: Al hacer click en "Download" le saldra una ventana emergente como la imagen siguiente:Paso 4: Instalando el paquete RPM de Oracle SQL DeveloperPaso 5: Verificando Instalación, haciendo click en el menú aplicaciones,programación y luego en el icono de Oracle SQL Developer.Lo siguiente ya es historia, tu mismo lo descubrirás.Bueno esto sería todo.Si tienes algún tema que sugerir dejalo en los comentarios. Hasta pronto!!!Atte @jofrantoba