back arrow jumping in Navigation Bar

[Developer12145]

Hi Isomorphic,

We are using the Navigation Bar with Animated Transitions. Our values sometimes span over two lines, like in this case, with the following code:

isc.NavigationBar.create({
    ID : "navBar",
    width : 296,
    leftButtonTitle : "Folders</br>foobar",
    rightButtonTitle : "New",
    showRightButton : true,
    title : "Inbox",
    animateStateChanges: true,
    navigationClick : function(direction) {
        if (direction == "back") {
            if (this.leftButtonTitle == "Inbox") {
                this.setRightButtonTitle("New");
                this.setViewState({
                    leftButtonTitle: "Folders</br>foobar",
                    title: "Inbox"
                }, "back");
            } else if (this.leftButtonTitle == "Folders</br>foobar") {
                this.setRightButtonTitle("Inbox");
                this.setViewState({
                   leftButtonTitle: "Exit",
                   title: "Folders</br>foobar"
                }, "back");
            } else if (this.leftButtonTitle == "Exit") {
                isc.say("Exiting");
            }
        } else {
            if (this.title == "Inbox") {
                this.setRightButtonTitle("Done");
                this.setViewState({
                    leftButtonTitle: this.title,
                    title: "New Message"
                }, "forward");
            } else if (this.title == "Folders</br>foobar") {
                this.setRightButtonTitle("New");
                this.setViewState({
                    leftButtonTitle: "Folders</br>foobar",
                    title: "Inbox"
                }, "forward");
            } else if (this.title == "New Message") {
                isc.say("Sending message");
                this.setRightButtonTitle("New");
                if (this.leftButtonTitle == "Inbox") {
                    this.setViewState({
                        leftButtonTitle: "Folders</br>foobar",
                        title: "Inbox"
                    }, "back");
                } else if (this.leftButtonTitle == "Folders</br>foobar") {
                    this.setViewState({
                        leftButtonTitle: "Exit",
                        title: "Folders</br>foobar"
                    }, "back");
                }
            }
        }
    }

});

In this example, if You click on "New" and then on "Done" You can see, how the back arrow jumps up to the upper line before aligning centered again.

SmartClient Version: v12.0p_2018-10-09/AllModules Development Only (built 2018-10-09)

Kind Regards

[Isomorphic]

Multi-line navigation titles is definitely something to avoid - you’ll notice that doesn’t appear anywhere in popular iOS apps. Since this is cosmetic *and* transient *and* related to usage we don’t recommend, we will be treat this as wontfix, but if you absolutely must correct this you could do it via Feature Sponsorship.