Templates y Temas para ExtJS y Sencha Touch Bleext!
Bleextop! un desktop OpenSource para Ext4 y CodeIgniter http://bit.ly/pUwLJO
[SOLUCIONADO] Layout Card con imagenes ....
  • Vote Up0Vote Down dimmidimmi October 2011
    Posts: 43
    Hola que tal, estoy trabajando en un visor de imagenes empleando un layout card, los paneles contenidos dentro del mismo los genero al vuelo y el contenido de ellos (imagen distinta) la mando a cargar cuando avanzo o retrocedo, el problema es que no cambia la imagen, se queda en la primera .... aunque por el firebug veo que si se efectua la peticion al script php que me carga la imagen. Dejo el codigo :


    var index=0;
    var archivos=new Array(); // genero array para almacenar los id de archivos
    var card = new Ext.Panel({
    id:'panelw',
    layout:'card',
    defaults: {
    border:false
    },
    bbar: [
    {id: 'move-prev',text: 'Atras',disabled: true,handler:function(){
    if(index < card.items.length){
    index--;
    var cardlayout = card.getLayout();
    Ext.getCmp('panel-'+index).body.load('http://mistio/vfile.php?id_archivo='+archivos[index]);
    Ext.getCmp('panel-'+index).doLayout();
    cardlayout.setActiveItem(index);
    if(index == 0){
    Ext.getCmp('move-prev').disable();
    Ext.getCmp('move-next').enable();
    }
    }
    }
    },
    '->', // greedy spacer so that the buttons are aligned to each side
    {id: 'move-next',text: 'Siguiente',handler:function(){
    if(index < card.items.length-1){
    index++;
    var cardlayout = card.getLayout();
    Ext.getCmp('panel-'+index).body.load('http://misitio/vfile.php?id_archivo='+archivos[index]);
    Ext.getCmp('panel-'+index).doLayout();
    cardlayout.setActiveItem(index);
    if(index>0)Ext.getCmp('move-prev').enable();
    if(index == card.items.length-1) Ext.getCmp('move-next').disable();
    }
    }
    }
    ]
    });

    var Ven=new Ext.Window({
    title:'Visor de imagenes',
    width:700,
    height:600,
    layout :'fit',
    modal :true,
    items :[card],
    listeners:{
    show:function(){
    Ext.Ajax.request({ // obtengo todas las imagenes
    url:'tabs/ctranexos/listadoanexos',
    params:{id:61401}, // id de usuario para buscar sus archivos
    success:function(response,request){
    var json=Ext.decode(response.responseText);
    archivos=[];
    json.data.forEach(function(item){
    Ext.getCmp('panelw').add({ // genero paneles para cada imagen
    id:item['nombre_panel'],
    width :'100%',
    title :'Archivo: '+item['nombre'],
    border:false
    });
    archivos.push(item['id_archivo']);
    });
    Ext.getCmp('panelw').getLayout().setActiveItem(0);
    Ext.getCmp('panel-'+index).body.load('http://misitio/vfile.php?id_archivo='+direcciones[0]);
    }
    });

    }
    }
    });
    Ven.show();

    gracias por la ayuda .....
  • 1 Answer sorted by
  • Vote Up0Vote Down dimmidimmi December 2011
    Posts: 43
    La solucion al problema la encontre hace un tiempo .. una disculpa al foro por no haberla posteado en su momento , la clave fue aplicar el metodo update al panel que contenedor de las imagenes despues del incremento o decremento, incluso me dio tiempo de adornalo un poco con un efecto de transicion ...


    Ext.getCmp('panelw').getLayout().setActiveItem(index);
    Ext.getCmp('panel-'+index).update('<iframe src="ruta imagen'" border="none" width="100%" height="100%"></iframe>');
    Ext.getCmp('panel-'+index).doLayout();
    Ext.get('panel-'+index).slideIn('l', { duration: 1});


    saludos ....
Add a Comment

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Login with Facebook Sign In with Twitter

Sign In Apply for Membership

Categories

In this Discussion

Poll

No poll attached to this discussion.

Tagged