trigger.io: topbar colours inconsistent between iOS 6.1, iOS 7.x

0
votes

I'm trying to update an app to work in both of iOS6.1 and iOS7.x, but it appears to be impossible to support both iOS versions when using trigger.io 2.1.4 with the topbar 2.4 and tabbar 2.4 modules.

To summarize, the problem seems to be that:

  • forge.topbar.addButton.tint sets the background colour in iOS6
  • forge.topbar.addButton.tint sets the text colour in iOS7
  • there is no way to control the text colour of buttons in iOS6

I want to know whether this is a bug (and if so, when a fix is expected), or whether this is somehow related to our use of the API.

Problems on iOS7.x

Here're the symptoms when the app is unchanged:

  • iOS 6.1 devices: colour settings work nicely
  • iOS 7.x devices: button colours render buttons invisible
Code sample 
// Sets the background colour of the topbar:
forge.topbar.setTint([62, 36, 107, 255]);
// Adds Back button, sets button colours:
forge.topbar.addButton(
  {
    text: 'Back',
    position: 'left',
    type: 'back',
    // Matches the button background colour to the tabbar:
    tint: [62, 36, 107, 255]
  },
);

Problems on iOS6.1

Here're the symptoms when the app is changed to try to make the buttons legible:

  • iOS 6.1 devices: button backgrounds and text are the same colour
  • iOS 7.x devices: colour settings work nicely
Code sample 
// Sets the background colour of the topbar:
forge.topbar.setTint([62, 36, 107, 255]);
// Makes the title in the topbar a readable colour in iOS7:
forge.topbar.setStatusBarStyle('light_content');
// Adds Back button, makes colours readable in iOS7:
forge.topbar.addButton(
  {
    text: 'Back',
    position: 'left',
    type: 'back',
    // Matches the button text colour to the topbar title colour:
    tint: [255, 255, 255, 255]
  },
);
1
iphoneios7ios6trigger.io

1 Answers

0
votes

Unfortunately Apple changed the semantic of "tint" with iOS7 which left us somewhat between a rock and a hard place with API design.

At the end of the day we ended up making the decision to honour Apple's redefinition for the simple reason that iOS6 is well on its way to being a distant memory.

It's not the most elegant solution, but your particular case can be handled by adding the platform module to your app and doing something like:

forge.platform.getVersion(function (version) {
    forge.topbar.setTint([62, 36, 107, 255]);
    var tint = [62, 36, 107, 255];
    if (forge.is.ios() && parseInt(version[0]) > 6) {
        tint = [255,255,255,255];
    }
    forge.topbar.addButton({
        text: 'Back',
        position: 'left',
        type: 'back',
        tint: tint
    });
});