Sencha touch 2 - Как открыть новый вид при нажатии на элемент списка - PullRequest
Новая
       1

Sencha touch 2 - Как открыть новый вид при нажатии на элемент списка

0 голосов
/ 01 марта 2012

По щелчку НОВОСТИ я хочу нажать вид (карточку). Это мой контроллер. Я не использую вид навигации. Как это сделать. 

config:{
    routes:{
        'News/index': 'showNews',
    },
    refs : {
        main : 'mainpanel',
    },

    control : {
        'navigation': {
                   select : 'showLanding'
                 }
           }
     },

    showNews : function(){
                 this.getMain().add({
                   xtype: 'blogview'
                    });
                },
    showLanding :   function(list,record) {
                           switch(record.data.navLink){

                               case "NEWS" : {
                                              this.getMain().setActiveItem('blogview');                                        
                                              break;
                                            }
                                case "PHOTOS" : {

                                               this.getMain().push({                                             
                                                 xtype:'photoview',
                                              });
                                              break;
                                            }

                            }
                          }

Я думаю, что мы не можем дать два или более элементов в виде навигации. Можете ли вы помочь PLZ

Спасибо заранее. :)

Ответы [ 3 ]

2 голосов
/ 02 марта 2012

Вы можете использовать setActiveItem для контейнера с макетом card .Вот простой пример: 

Ext.setup({
    onReady:function(){
        var container = Ext.create('Ext.Container', {
            layout: 'card',
            items: [
                {
                    items: [
                        {
                            xtype: 'button',
                            text: 'Tap this to add a new view',
                            handler: function() {
                                container.setActiveItem({
                                    html: 'This is the new item.'
                                });
                            }
                        }
                    ]
                }
            ]
        });

        Ext.Viewport.add(container);
    }
});

И вы можете добавить анимацию, указав ее в конфигурации макет : 

layout: {
    type: 'card',
    animation: {
        type: 'slide',
        direction: 'left',
        duration: 1000
    }
}

В полном составе: 

Ext.setup({
    onReady:function(){
        var container = Ext.create('Ext.Container', {
            layout: {
                type: 'card',
                animation: {
                    type: 'slide',
                    direction: 'left',
                    duration: 1000
                }
            },
            items: [
                {
                    items: [
                        {
                            xtype: 'button',
                            text: 'Tap this to add a new view',
                            handler: function() {
                                container.setActiveItem({
                                    html: 'This is the new item.'
                                });
                            }
                        }
                    ]
                }
            ]
        });

        Ext.Viewport.add(container);
    }
});
1 голос
/ 06 марта 2012

1) Присвойте ID контейнеру, вид которого вы хотите изменить.

2) В вашем контроллере получите ссылку на контейнер по идентификатору и вызовите соответствующий метод для загрузки представления.

Например, если вы используете Navigation.View в качестве контейнера, вызовите метод push для загрузки требуемого представления 

Ext.ComponentManager.get('mynavigationview').push({
      title: 'Second',
      html: 'Second view!'
      });

Обратите внимание, что вам необходимо использовать Ext.ComponentManager.get в качестве Ext.get'не работает с компонентами.

0 голосов
/ 25 февраля 2013

Вот пример с контроллера, который у меня есть.Я удалил дополнительный код в методе onListItemTap.

Убедитесь, что ваша ссылка действительно работает.Если ваша 'mainPanel' представляет собой панель навигации, вы можете добавить новые элементы, например, так: 

Ext.define('MyApp.controller.MyController', {
extend: 'Ext.app.Controller',

config: {
    refs: {
        mainPanel: 'main'
    },

    control: {
        "list": {
            itemtap: 'onListItemTap'
        }
    }
},

onListItemTap: function (dataview, index, target, record, e, options) {
    var myView = Ext.create('Ext.Container', {
    ...
    ...
    });

    this.getMainPanel().push(myView);
}

});

Для вашей главной панели должно работать что-то вроде этого: 

Ext.define('MyApp.view.Main', {
    extend: 'Ext.navigation.View',
    xtype: 'main',

    config: { }
});
...