Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-15414] iOS7: Allow users to set the Title Color of the Windows

GitHub Issuen/a
TypeNew Feature
PriorityHigh
StatusClosed
ResolutionFixed
Resolution Date2013-11-13T23:40:33.000+0000
Affected Version/sRelease 3.1.3
Fix Version/s2013 Sprint 21, 2013 Sprint 21 API, 2013 Sprint 23 API, Release 3.2.0
ComponentsiOS
Labelsios, ios7, module_navwindow, navbar, navigation, navigationWindow, qe-testadded
ReporterYgor Lemos
AssigneeVishal Duggal
Created2013-10-05T00:39:39.000+0000
Updated2014-11-30T00:12:02.000+0000

Description

We should allow users to set the Window titleColor without having to create a custom Label and setting it as the titleControl since you can do this natively (at least on Interface Builder). Ideally, beside the navTintColor and the tintColor window parameters we should have a parameter called titleColor where the user can define the color for the title text on the NavBar. Also we should map titleShadowColor, titleShadowOffset and titleFont for setting a title shadow color, offset and font as those are all available natively on IB. Those are all supported natively on the Interface Builder and should be mapped to Ti.

Attachments

FileDateSize
Screen Shot 2013-10-04 at 9.39.16 PM.png2013-10-05T00:39:39.000+000051808

Comments

  1. Vishal Duggal 2013-10-17

    You can customize font, shadow and color of title in navBar Test Case
       var attributes = [
        {color:'red'},
        {font:{fontFamily:'AvenirNextCondensed-DemiBoldItalic',fontSize:18}},
        {shadow:{color:'green',offset:{width:1,height:1}}},
        {color:'red',font:{fontFamily:'AvenirNextCondensed-DemiBoldItalic',fontSize:18},shadow:{color:'green',offset:{width:1,height:1}}}
       ]
       
       
       var counter = 0;
       
       function genWindow(nav)
       {
           var index = counter % 5;
           counter = counter + 1;
           var win = Ti.UI.createWindow({
               title:'Custom Title',
               backButtonTitle:'Back',
               backgroundColor:'white'
           })
       
           var view = Ti.UI.createView({
               height:Ti.UI.SIZE,
               layout:'vertical'
           })
       
           var label = Ti.UI.createLabel({top:5});
           view.add(label);
           var btn = Ti.UI.createButton({title:'NEXT',top:5});
           view.add(btn)
           if (index < 4) {
               win.titleAttributes = attributes[index];
               label.text = 'Attributes:\n'+JSON.stringify(attributes[index]);
               btn.shadowColor = 'magenta';
               btn.shadowOffset = {x:-1,y:1};
           } else {
               label.text = 'No Attributes';
           }
       
           
       
           btn.addEventListener('click',function(e){
               nav.openWindow(genWindow(nav));
           })
       
           win.add(view);
       
           win.addEventListener('close',function(){
               counter = counter - 1;
           })
       
           return win
       
       }
       
       var nav = Ti.UI.iOS.createNavigationWindow({})
       nav.window = genWindow(nav);
       nav.open();
       
  2. Vishal Duggal 2013-10-17

    Pull pending against master https://github.com/appcelerator/titanium_mobile/pull/4801
  3. Pragya Rastogi 2013-10-21

    Tested with : OSX: 10.8.5 Xcode:5.0 Appcelerator Studio: 3.2.0.201310181700 SDK:3.2.0.v20131018154951 acs:1.0.7 alloy:1.2.2 npm:1.3.2 titanium:3.2.0 titanium-code-processo:1.0.3 Device: iPod touch 2 (v iOS7)
  4. Vishal Duggal 2013-11-13

    This PR has caused a regression. Reopening to fix
  5. Vishal Duggal 2013-11-13

    Test case for regression. Note that the default back button title does not show.
       
       var counter = 0;
       
       function genWindow(root, nav) {
           var win = Ti.UI.createWindow({
               backgroundColor:'white',
               layout:'vertical',
               winCounter:counter
           })
       
           var b1 = Ti.UI.createButton({top:40,title:'NEXT'})
           win.add(b1);
       
           b1.addEventListener('click',function(e){
               nav.openWindow(genWindow(false,nav));
           })
       
           if (root == false) {
               var b2 = Ti.UI.createButton({title:'CLOSE'});
               win.add(b2);
       
               b2.addEventListener('click',function(e){
                   win.close();
               })
           }
       
           win.addEventListener('open',function(e){
               Ti.API.info('OPEN FIRED '+e.source.winCounter);
               counter = counter + 1;
           })
           win.addEventListener('close',function(e){
               Ti.API.info('CLOSE FIRED '+e.source.winCounter);
               counter = counter - 1;
           })
           win.addEventListener('focus',function(e){
               Ti.API.info('FOCUS FIRED '+e.source.winCounter);
           })
           win.addEventListener('blur',function(e){
               Ti.API.info('BLUR FIRED '+e.source.winCounter);
           })
       
       
           return win;
       }
       
       
       
       var nav1 = Ti.UI.iOS.createNavigationWindow({})
       
       var root = genWindow(true,nav1);
       
       nav1.window = root;
       
       nav1.open();
       
  6. Vishal Duggal 2013-11-13

    Pull pending for regression https://github.com/appcelerator/titanium_mobile/pull/4962
  7. Wilson Luu 2013-11-25

    Closing ticket as fixed. Verified the window.title color can be set and the regression test case; the default back button title shows up now. Tested on: Titanium Studio, build: 3.2.0.201311221859 SDK build: 3.2.0.v20131122172908 CLI: 3.2.0-alpha Alloy: 1.3.0-alpha6 Xcode: 5.0.2 Device: iphone 5 (6.1.3), iphone 5 (7.0.2)
  8. Hans Knöchel 2014-11-29

    Broken in the latest 3.4.2 Build (3.4.2.v20141125154126). The color property is not honored in the titleAttribute. Expected behaviour: http://abload.de/image.php?img=expected4dzns.png Actual behaviour: http://abload.de/image.php?img=resultrqzzi.png Would be great to be fixed in the 3.4.2.GA, thank you!.
  9. Hans Knöchel 2014-11-30

    Correction: Everything perfect, using the color-property in the titleAttributes object: titleAttributes: { color: "#fff" }

JSON Source