Discussion Forums  >  Plugins, Customizing, Source Code

Replies: 17    Views: 476

Jake Chasan
Veteran developer
Profile
Posts: 1685
Reg: May 13, 2011
location unknow...
29,650
12/21/13 01:02 PM (10 years ago)

Custom Font and Color BT3.0 Nav Bar

Hi All, Has anyone figured out how to do a custom font and custom color for the text on the Nav Bar with BT3.0 and iOS 7? Jake
 
mysps
Code is Art
Profile
Posts: 2082
Reg: May 14, 2011
Palma
33,320
like
12/21/13 01:20 PM (10 years ago)
You could probably check in the BT_application . check out Absentia's post about customizing the color for the tab bar https://www.buzztouch.com/forum/thread.php?tid=65F7DCD7D2E7DD8ECF7C9AC
 
nadthevlad
Code is Art
Profile
Posts: 1025
Reg: Jun 07, 2012
Denver
21,850
like
12/21/13 02:46 PM (10 years ago)
 
Susan Metoxen
buzztouch Evangelist
Profile
Posts: 1706
Reg: May 01, 2011
Hopkins, Minnes...
26,260
like
12/21/13 11:45 PM (10 years ago)
I did. I'll post tomorrow, though. It's after midnight here.
 
bfoutty
Code is Art
Profile
Posts: 185
Reg: Jun 12, 2011
Youngstown, OH
12,650
like
12/22/13 06:17 AM (10 years ago)
Jake, Here is a discussion thread regarding changing the font in a BT app: https://www.buzztouch.com/forum/thread.php?tid=597114E1B3B3F41AC2CCDA5&sortColumn=FT.id&sortUpDown=DESC&currentPage=3 Brian
 
Susan Metoxen
buzztouch Evangelist
Profile
Posts: 1706
Reg: May 01, 2011
Hopkins, Minnes...
26,260
like
12/22/13 06:51 PM (10 years ago)
This is how I did it--not sure if this way is better than the others that have been posted. It would be nice to get this into a property that could be set in the control panel. It would be good to have separate controls for the Right/Left and the Title Text, so they can be a different color. This sets the color of the right and left nav buttons BT_application.m lines 613-614 thisTabsNavController.navigationBar.tintColor = [UIColor whiteColor]; To change the status bar color, add this to “View Will Appear” in all plugins in use in the app: [[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleLightContent]; To change the color of the Title Text: appDelegate.m line 89—just change to the color you want [self setNavBarTitleTextColor:@"#ffffff"]; I don't think this did anything, but per StackOverflow I added the following to the PLIST. I didn't take it out, so if the steps above don't work, then add this to the next app too. Status Bar Style:UIStatusBarStyleLightContent View controller-based status bar….:NO Status bar is initially hidden: NO
 
Niraj
buzztouch Evangelist
Profile
Posts: 2943
Reg: Jul 11, 2012
Cerritos
37,930
like
12/22/13 11:14 PM (10 years ago)
These additions to the BT_info.plist file within the BT_Config group folder had no effect: (1) UIStatusBarHidden to NO (hides the status bar during launch of the app, when the launch screen is being displayed) (2) UIStatusBarStyle to UIStatusBarStyleLightContent (text in the Status Bar is set to white color) (3) UIViewControllerBasedStatusBarAppearance to NO (disables each View Controller / BT Screen from setting the Status Bar's appearance) Even though it did not work, I am posting it so that you have the correct syntax and the meaning for each item.
 
Niraj
buzztouch Evangelist
Profile
Posts: 2943
Reg: Jul 11, 2012
Cerritos
37,930
like
12/22/13 11:23 PM (10 years ago)
An easier way to change the Status Bar text color: 1. Open the BT_Config group folder 2. Edit the xxxx_appDelegate.m file 3. Go to line #77 and change the code as shown: --------------- Before the change: [self setStatusBarStyle:UIStatusBarStyleDefault]; After the change: [self setStatusBarStyle:UIStatusBarStyleLightContent]; ----------- You only have to change it in that one file. The Status Bar will then have the same white colored text across all the Screens ( Plugins / ViewControllers ). UIStatusBarStyleDefault = black text (for light backgrounds of Status Bars) UIStatusBarStyleLightContent = white text (for dark backgrounds of Status Bars)
 
Niraj
buzztouch Evangelist
Profile
Posts: 2943
Reg: Jul 11, 2012
Cerritos
37,930
like
12/23/13 12:38 AM (10 years ago)
To change the color of the Left and Right buttons on the Navbar (Nav Bar), we should make edits to the BT_ViewController.m file. ( Ideally, these changes can be controlled via Theme settings on the Web Control Panel, but that has not yet been implemented. I shall make that request. :-) 1. Open the BT_Layout group folder 2. Edit the BT_ViewController.m file 3. Find the line that says "setup nav bar", should be close to Line #172 4. After that line, insert this code: // Color the left-right buttons on Navbar if ( iosVer > 6 ) { self.navigationController.navigationBar.tintColor = [BT_color getColorFromHexString:@"#88BBFF"]; } The color for the Left-Right Buttons on the Navbar will also cause the Refresh button on the Home Screen to have that same color. In my example, the Refresh button will be a light-blue color. I do not want the User's eyes to be drawn to an hardly used Refresh button by coloring it a light-blue color. Instead, I want that particular Refresh button to be colored a light-gray color. 1. In the same file, find the 2nd-instance of theRefreshButtonItem. It should be in the area of Line #215 2. After that line, add this code: // Color the Refresh button a light-gray color (just for Home Screen) if ( iosVer > 6 ) { self.navigationController.navigationBar.tintColor = [UIColor lightGrayColor]; } Best wishes! -- Niraj
 
David @ buzztouch
buzztouch Evangelist
Profile
Posts: 6866
Reg: Jan 01, 2010
Monterey, CA
78,840
like
12/23/13 01:22 AM (10 years ago)
Hi guys, First things first. You're asking a few different things here. I'll do my best to make this short, and understandable. 1) Status bar and Nav Bar text colors are two different things. iOS7 will NOT allow the status bar color to change. It's either light or dark, there is no way around this. @Niraj is correct in that you can change the status bar color to light or dark easily. He is also correct that you can change this globally in the app's delegate on line #77. This is here intentionally, so you can change it. 2) Button / title color: @Niraj is also correct in that you can change this globally by making an adjustment to the BT_viewController.m file. Remember, all plugins are derived from this class (they are sub-classes of BT_viewController which in tern is a sub-class of UIViewController). All the plugins setup the nav bar using the configurNavBar method on line #98 of this file. When customizing fonts, you'll usually want to change the font family and the font color. There are tons of ways to do this. Because custom fonts in the nav bar are global, I generally do it like this: --first, include the custom font file in your project. More on that in a minute. In this example, I'll use a cool font called "NexaLight" --Next, tell the BT_viewController.m file to use this font, with a color, when setting up the navigation bar. Around line 440 or so, after everything is done in the nav bar setup, just before the last curley brace, declare a font, set the titleTextAttributes, then apply them... //create a font object using the custom font in your project... UIFont *coolFont = [UIFont fontWithName:@"NexaLight" size:withSize]; //create a dictionary of font attributes to use...size it 18...color it white... NSDictionary *attributes = [NSDictionary dictionaryWithObjectsAndKeys:coolFont:18], NSFontAttributeName, [UIColor whiteColor], NSForegroundColorAttributeName, nil]; //set the title text attributes in the nav bar... [[UINavigationBar appearance] setTitleTextAttributes:attributes]; Including custom font files in your xcode project requres a few steps. It's about dragging them into your project like any other resource. Font files are usually .otf (open type face) files. Then, after dragging them in, it's necessary to add them to your app's .plist file to tell iOS you've included them and intend on using them. Google "UIAppFonts" in the plist for how to do this. It's easy. Now, all your custom fonts are available in your app. Another cool trick I use all the time is to ask the BT_device class to output a list of all the custom fonts included in the project so I can see the font names in the console. Add this to the BT_device class in the init method to output all the custom fonts: //show all the custom font names available... [BT_debugger showIt:self message:[NSString stringWithFormat:@"Listing custom fonts (UIAppFonts) listed in app's .plist...%@", @""]]; NSDictionary* infoDict = [[NSBundle mainBundle] infoDictionary]; NSArray* fontFiles = [infoDict objectForKey:@"UIAppFonts"]; for (NSString *fontFile in fontFiles) { NSURL *url = [[NSBundle mainBundle] URLForResource:fontFile withExtension:NULL]; NSData *fontData = [NSData dataWithContentsOfURL:url]; CGDataProviderRef fontDataProvider = CGDataProviderCreateWithCFData((__bridge CFDataRef)fontData); CGFontRef loadedFont = CGFontCreateWithDataProvider(fontDataProvider); NSString *fullName = CFBridgingRelease(CGFontCopyFullName(loadedFont)); CGFontRelease(loadedFont); CGDataProviderRelease(fontDataProvider); [BT_debugger showIt:self message:[NSString stringWithFormat:@"----Font: %@", fullName]]; } Have a look at the console, you'll see a list of all the fonts when the app launches. This makes it much easier to get the available font names.
 
Jake Chasan
Veteran developer
Profile
Posts: 1685
Reg: May 13, 2011
location unknow...
29,650
like
12/23/13 01:25 AM (10 years ago)
@David: Thanks for posting and clearing up the confusion. Have you seen this website: http://iosfonts.com I find it useful for finding iOS fonts. Thanks, Jake
 
David @ buzztouch
buzztouch Evangelist
Profile
Posts: 6866
Reg: Jan 01, 2010
Monterey, CA
78,840
like
12/23/13 02:38 AM (10 years ago)
EDIT: @Jake: Yes, I know the site well. Good stuff there. Forgot an important point. Regarding the control panel allowing these types settings. This is exactly what the Theme's raw JSON allows you to do. You can introduce any type of property value pair you want. Example: You could add: "navBarFontColor":"#FFFFFF" to the theme, then you could use this dynamic value in the BT_viewController.m method be accessing the theme's color for the nav bar font before settings it's value. You could of course do this on a screen by screen basis too. You would do this by setting the json property / value in the raw JSON for one screen, not globally in the theme.
 
Jake Chasan
Veteran developer
Profile
Posts: 1685
Reg: May 13, 2011
location unknow...
29,650
like
12/23/13 09:02 AM (10 years ago)
@David: Good idea. Did you get my email with the updated icons? Jake
 
Uelsimon
Lost but trying
Profile
Posts: 272
Reg: Mar 25, 2012
NYC
4,470
like
12/27/13 08:15 PM (10 years ago)
ok..I tried everything…and I’ve gotten the following results: - STATUS BAR: CHANGED - NAV BAR BUTTONS: CHANGED - NAV BAR TITLE TEXT: NO CHANGE Can’t seem to figure out how to override this one, but nothing seems to have any impact on the Title Text appearance. Any ideas? Again…everything else has changed successfully except for that one holdout. Thanks €
 
Uelsimon
Lost but trying
Profile
Posts: 272
Reg: Mar 25, 2012
NYC
4,470
like
12/27/13 09:58 PM (10 years ago)
ok found something. around line 377 in BT_viewController.m changed the [appDelegate navBarTitleTextColor] from //set the title text color using the value saved in the app's delegate... self.navigationController.navigationBar.titleTextAttributes = @{UITextAttributeTextColor:[BT_color getColorFromHexString:[appDelegate navBarTitleTextColor]]}; to //set the title text color using the value saved in the app's delegate... self.navigationController.navigationBar.titleTextAttributes = @{UITextAttributeTextColor:[BT_color getColorFromHexString:@"#FFF"]}; or //set the title text color using the value saved in the app's delegate... self.navigationController.navigationBar.titleTextAttributes = @{UITextAttributeTextColor:[UIColor whiteColor]}; but thats the place that the change worked. phew! €
 
JimmySaver
Aspiring developer
Profile
Posts: 187
Reg: Apr 09, 2012
location unknow...
5,870
like
08/14/14 01:54 AM (9 years ago)
Hello all. Before opening up a new topic on this, does anyone know if the fix above still works for changing the nav bar font? I've followed the above in the viewController.m and it's throwing errors. Namely around this: //create a font object using the custom font in your project... UIFont *coolFont = [UIFont fontWithName:@"NexaLight" size:withSize]; //create a dictionary of font attributes to use...size it 18...color it white... NSDictionary *attributes = [NSDictionary dictionaryWithObjectsAndKeys:coolFont:18], NSFontAttributeName, [UIColor whiteColor], NSForegroundColorAttributeName, nil]; //set the title text attributes in the nav bar... [[UINavigationBar appearance] setTitleTextAttributes:attributes]; Errors are: 1. use of undeclared identifier 'withSize' 2. non known class method for selector 'dictionaryWithObjectsAndKeys' 3. Missing '[' at start of message send expression 4. Interface type cannot be statically allocated 5. Expected ']' 6. Expected identifier or '(' Any guidance appreciated. Thanks.
 
JimmySaver
Aspiring developer
Profile
Posts: 187
Reg: Apr 09, 2012
location unknow...
5,870
like
08/14/14 08:53 AM (9 years ago)
Using all the top tips above and a bit more searching, got it working. Around line 416 in BT_viewcontroller.m: //Nav Bar Font Change NSShadow *shadow = [[NSShadow alloc] init]; shadow.shadowColor = [UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.8]; shadow.shadowOffset = CGSizeMake(0, 1); [[UINavigationBar appearance] setTitleTextAttributes: [NSDictionary dictionaryWithObjectsAndKeys: [UIColor colorWithRed:245.0/255.0 green:245.0/255.0 blue:245.0/255.0 alpha:1.0], NSForegroundColorAttributeName, shadow, NSShadowAttributeName, [UIFont fontWithName:@"**fontname**" size:16.0], NSFontAttributeName, nil]];
 
benedettoapp
Lost but trying
Profile
Posts: 139
Reg: Jun 22, 2013
Italy
6,340
like
12/04/14 01:55 PM (9 years ago)
what about android, (navigation bar text color) please.
 

Login + Screen Name Required to Post

pointerLogin to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.