1. #1
    Sencha User senchaSaurav's Avatar
    Join Date
    Feb 2012
    Location
    Bangalore, India
    Posts
    41
    Vote Rating
    0
    senchaSaurav is on a distinguished road

      0  

    Default Navigation View Title (IPad App)

    Navigation View Title (IPad App)


    Hi,
    On a tap of item, how to set the title of the Navigation View dynamically?
    For e.g.: The item value which I have selected, I want to set the same value on the title of Navigation View.
    How can I do it?

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,754
    Vote Rating
    827
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    It will use the title of the item being pushed.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Feb 2012
    Location
    Illinois
    Posts
    93
    Vote Rating
    2
    bwags is on a distinguished road

      0  

    Default Dynamically...

    Dynamically...


    But what if you want to set the title dynamically?

    For example, inside a controller:

    Code:
    this.getMyNavigationView().push({xtype : 'someContainerView'});
    The SomeContainerView is an 'Ext.Container', which does not have a 'setTitle()' method.

    So I find myself doing

    Code:
    this.getSomeContainerView().config.title = record.get('title');
    Is there a better way around this? It doesn't quite feel right

    Thanks for any ideas!!

    Brad

  4. #4
    Sencha User
    Join Date
    Feb 2012
    Location
    Illinois
    Posts
    93
    Vote Rating
    2
    bwags is on a distinguished road

      0  

    Default Solved

    Solved


    Shoot...my apologies,

    this works:

    Code:
    this.getMyViewport().push({
        xtype : 'myContainer',
        title : record.get('title')
    });
    Thanks again!

    Brad

  5. #5
    Sencha User senchaSaurav's Avatar
    Join Date
    Feb 2012
    Location
    Bangalore, India
    Posts
    41
    Vote Rating
    0
    senchaSaurav is on a distinguished road

      0  

    Default


    Thanks...

  6. #6
    Sencha Premium Member
    Join Date
    Feb 2012
    Posts
    270
    Vote Rating
    10
    worthlutz is on a distinguished road

      0  

    Default


    What if the view is already pushed and you are popping back to it after a store reload and want to change the title?

    How would that be done?

    Worth

  7. #7
    Sencha User
    Join Date
    Feb 2012
    Location
    Illinois
    Posts
    93
    Vote Rating
    2
    bwags is on a distinguished road

      0  

    Default This kind of works.

    This kind of works.


    I'm trying to get something to work but haven't quite been able to. Here's some code.

    A NavigationView, Panel (testviewone) to be initially pushed, and another Panel (testviewtwo) to be pushed and popped via a button in view one.

    Code:
    Ext.define('MyApp.view.util.TestView', {    extend : 'Ext.NavigationView',
        alias : 'widget.testview',
    
    
    });
    
    
    Ext.define('MyApp.view.util.TestViewOne', {
        extend : 'Ext.Panel',
        alias : 'widget.testviewone',
    
    
        config : {
            html : 'Test View One',
    
    
            items : [ {
                xtype : 'button',
                id : 'newviewbutton',
                text : 'View Two',
            } ]
        }
    });
    
    
    Ext.define('MyApp.view.util.TestViewTwo', {
        extend : 'Ext.Panel',
        alias : 'widget.testviewtwo',
    
    
        config : {
            html : 'Test View Two',
        }
    });
    Finally a controller for all the logic.

    Code:
    Ext.define('MyApp.controller.TestController', {
        extend : 'Ext.app.Controller',
    
    
        requires : [ 'MyApp.view.util.TestViewOne',
                'MyApp.view.util.TestViewTwo' ],
    
    
        config : {
            refs : {
                testView : 'testview',
                testViewOne : 'testviewone',
                testViewTwo : 'testviewtwo',
                newViewButton : 'testviewone #newviewbutton'
            },
    
    
            control : {
                testView : {
                    show : 'pushViewOne',
                    pop : 'changetestviewtitle',
                },
    
    
                newViewButton : {
                    tap : 'pushViewTwo'
                }
            }
        },
    
    
        pushViewOne : function() {
            this.getTestView().push({
                xtype : 'testviewone',
                title : 'Test View One',
            });
        },
    
    
        pushViewTwo : function() {
            console.log('Pushing View');
    
    
            this.getTestView().push({
                xtype : 'testviewtwo',
                title : 'Brand New Title'
            });
        },
    
    
        changetestviewtitle : function() {
            console.log('Changing test view title');
            this.getTestViewOne().config.title = 'New One!';
            this.getTestViewOne().setHtml('New HTML!');
        }
    });

    Open and click the button to push testviewtwo, then pop with the back button. Now in your developer console run 'Ext.ComponentQuery.query('testviewone');'.

    Notice the config.title="New One!" but t is not reflected in the title bar. I don't think I would call this a bug because the title attribute is not advertised as public or settable, but more control over the title attribute would be really nice.

    Brad

  8. #8
    Sencha Premium Member
    Join Date
    Feb 2012
    Posts
    270
    Vote Rating
    10
    worthlutz is on a distinguished road

      0  

    Default


    I've figured this out today but don't have access to my code tonight.

    It went something like this:

    Code:
    getView().query('titlebar')[0].setTitle('newTitle);
    My views were just containers and I added a title bar to them.

    If the component already has a title, is there already a "titlebar" to query for and then set the title?

    I'll try to send more information tomorrow.

    Worth

  9. #9
    Sencha User
    Join Date
    Apr 2012
    Posts
    6
    Vote Rating
    1
    tarun_juneja@hotmail.com is on a distinguished road

      1  

    Default


    add this override

    Ext.override(Ext.navigation.Bar, {
    getNavigationBarProxyProperties: function () {
    return {
    title: {
    left: this.proxy.titleComponent.renderElement.getLeft()
    },
    backButton: {
    left: this.proxy.backButton.renderElement.getLeft(),
    width: this.proxy.backButton.renderElement.getWidth()
    }
    };
    }
    });

    and get the bar like this and set title dynamically

    var bar = mainViewComponent.getNavigationBar();
    bar.titleComponent.setTitle('dynamic title');

  10. #10
    Sencha User
    Join Date
    Sep 2011
    Location
    South Bend, IN
    Posts
    26
    Vote Rating
    0
    coolate is on a distinguished road

      0  

    Default


    I used this to get it working:
    via: Joeri Sebrechts

    Code:
    var bar = this.getMain().getNavigationBar();
    if (bar.titleComponent.element) bar.titleComponent.element.setWidth('auto');
    bar.titleComponent.setTitle(title);
    bar.refreshProxy();

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."