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);
       
    }

}




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…

Registrar driver oracle en iReport 3.7.1

Esta entrada la estoy escribiendo porque en algún momento necesite conectar ireport con mi base de oracle, para asi poder crear reportes, además aquí tambien se registran los archivos Jar para ordenar las columnas de un crosstab, pero esto lo explicare en otra entrada.
Bueno comenzemos, primero que nada abra su ireport la versión que tuviese. Luego de esto solo seguir todos los pantallazos que colocaré.
fig 1: Drivers para conexión a bases de datos.
En la fig1 se muestran todos lo drivers con los cuales se establece la conexión a base de datos a través de ireport, como se puede observar hay drivers de color rojo y negro, los negros están activos y los rojos son los drivers que aún no han sido registrados, en esta ocasión vamos a registrar el driver para conectarnos a una base de datos oracle.
Registrando el driver de oracle:
fig 2: Pestaña herramientas, subitem opciones
Una vez que hacemos click en el item Opciones nos saldra una ventana como la imagen de la fig 3.
fig 3: Ventana …

Instalando Open Broadcaster Software en CentOS 7

Saludos. Soy @jofrantoba. En este post te enseñare a instalar el OBS Studio el cual te permitira hacer grabaciones de audio y video, asi como también realizar Streaming a través de facebook, youtube y otros.

Paso 1: Instalar repositorio EPEL
En este enlace podrás encontrar el post de como hacerlo http://kiongotechnology.com/i-d/vblogdev/4-instalar-repo-epel-release-en-centos-7
Paso 2: Instalar repositorio RPM Fusion
En este enlace podrás encontrar el post de como hacerlo http://kiongotechnology.com/i-d/vblogdev/5-instalar-repo-rpmfusion-en-centos-7
Paso 3: Instalar repositorio Nux Desktop x86_64
En este enlace podrás encontrar el post de como hacerlo http://kiongotechnology.com/i-d/vblogdev/8-instalando-nux-desktop-x86-64-en-centos7
Paso 4: Instalar las siguientes librerias con el siguiente comando ejecutado en tu terminal
sudo yum install gcc gcc-c++ gcc-objc cmake git

Paso 5: Instalar las siguiente dependencias de OBS Studio ejecutando el siguiente comando en tu terminal

sudo yum install lib…