Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Aug 2014
    Posts
    14
    Vote Rating
    1
    memanuele is on a distinguished road

      0  

    Default Double border shown between tabs when using Cupertino theme

    Double border shown between tabs when using Cupertino theme


    I have this Sencha Touch 2 code which uses the Cupertino theme:
    Code:
        var tabs = {
            xtype: 'tabpanel',
            items: [
                {title: 'Tab 1'},
                {title: 'Tab 2'},
                {title: 'Tab 3'},
                {title: 'Tab 4'}
            ]
        };
    
        Ext.Viewport.add(tabs);


    If you look at the border between tab 2 and 3, you'll see the border is shown twice. This seems to happen only when the number of tabs is > 3. Is this a bug? Any workaround?
    Thanks.

    temp.jpg

  2. #2
    Sencha - Support Team
    Join Date
    Oct 2011
    Posts
    3,977
    Vote Rating
    132
    fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all

      0  

    Default


    This is a known issue TOUCH-5424. Currently there is no workaround.
    Get more personalized support via a support subscription.

    Want to learn Sencha Touch 2? Check out
    Sencha training
    Sencha Touch in Action

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

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

    Need to include a test case use:
    The official Sencha Fiddle

  3. #3
    Sencha User
    Join Date
    Aug 2014
    Posts
    14
    Vote Rating
    1
    memanuele is on a distinguished road

      0  

    Default


    Is there a fix planned for next release?
    Thanks.

  4. #4
    Sencha - Support Team
    Join Date
    Oct 2011
    Posts
    3,977
    Vote Rating
    132
    fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all

      0  

    Default


    I cannot say exactly when this issue will be addressed. But we are aware of it and it will be fixed in a future version of Touch.
    Get more personalized support via a support subscription.

    Want to learn Sencha Touch 2? Check out
    Sencha training
    Sencha Touch in Action

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

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

    Need to include a test case use:
    The official Sencha Fiddle

  5. #5
    Sencha User
    Join Date
    Aug 2014
    Posts
    14
    Vote Rating
    1
    memanuele is on a distinguished road

      0  

    Default


    Ok... while waiting for a fix I worked around the issue like this:

    I first defined these styles:

    Code:
    .tabFirst, .tabMiddle {
        border-top: 1px solid $ios7-blue !important;
        border-right: none !important;
        border-bottom: 1px solid $ios7-blue !important;
        border-left: 1px solid $ios7-blue !important;
    }
    
    
    .tabFirst {
        border-radius: 4px 0px 0px 4px !important;
    }
    
    
    .tabMiddle {
        border-radius: 0px !important;
    }
    
    
    .tabLast {
        border: 1px solid $ios7-blue !important;
        border-radius: 0px 4px 4px 0px !important;
    }
    and then I invoke this method after I add the tabs to the panel:

    Code:
    fixTabsStyle: function(tabPanel) {
        var items = tabPanel.getTabBar().getItems();
        var count = items.getCount(); 
        items.each(function(tab, index) {
            tab.addCls(index == 0 ? 'tabFirst' : index == count-1 ? 'tabLast' : 'tabMiddle');
        });
    }

  6. #6
    Sencha - Support Team
    Join Date
    Oct 2011
    Posts
    3,977
    Vote Rating
    132
    fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all

      0  

    Default


    Thanks for sharing your workaround.
    Get more personalized support via a support subscription.

    Want to learn Sencha Touch 2? Check out
    Sencha training
    Sencha Touch in Action

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

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

    Need to include a test case use:
    The official Sencha Fiddle

Thread Participants: 1

Tags for this Thread