Results 1 to 7 of 7
  1.    #1  
    I want to have a button like you see in the browser for going back; you know the one with the arrows on.

    Can someone give me a code snippet for how I do it, please?

    Many thanks.
  2. #2  
    Those buttons are typically used in a CommandMenu, which floats at the bottom of the scene. You can get left and right arrows by putting something like this in your setup function:
    Code:
    this.commandMenuModel = {
    	items: [
    		{items: [{icon: "back", command: "do-previousPage"}]},
    		{},
    		{items: [{icon: "forward", command: "do-nextPage"}]}
    		]
    };
    this.controller.setupWidget(Mojo.Menu.commandMenu, undefined, this.commandMenuModel);
    Notice the items array has three object literals, but the middle one is empty. That forces the first and third items out to the left and right sides of the scene.
    The "back" and "forward" icon names are the left and right arrow button images that are built into Mojo.
  3.    #3  
    Great thanks!

    One last question:

    How do I make the buttons visible then hidden?

    I only want to show back when the user can go back but hide when there is no back to go to, and the same for forward.

    Any ideas?

    Thanks.
  4. #4  
    Simply alter the items array so that it only has the buttons you want. Here's how I do it in the Help scene for Five Dice:
    Code:
    //Show the appropriate command menu buttons.
    switch (this.pageIndex) {
    case 0:
    	//First page--don't show the back arrow.
    	this.commandMenuModel.items[0] = {};
    	break;
    case (this.helpContents.pages.length - 1):
    	//Last page--don't show the forward arrow.
    	this.commandMenuModel.items[2] = {};
    	break;
    default:
    	//Show back and forward arrows if they're not already shown.
    	if (!this.commandMenuModel.items[0].hasOwnProperty("items")) {
    		this.commandMenuModel.items[0] = {items: [{icon: "back", command: "do-previousPage"}]};
    	}
    	if (!this.commandMenuModel.items[2].hasOwnProperty("items")) {
    		this.commandMenuModel.items[2] = {items: [{icon: "forward", command: "do-nextPage"}]};
    	}
    	break;
    }//switch
    this.controller.modelChanged(this.commandMenuModel);
  5.    #5  
    Nice one! Thanks!

    Two last questions:

    I have three items in the commandMenu; but I don't want them spread out. I want the forward and back buttons next to each other on the left, and a third button on its own on the right.

    Any ideas?

    Also, I've noticed there's an grey looking fade in the commandMenu; how do I get it complete clear as I don't want the grey fade.

    Any clues?

    Here's my code:

    this.commandMenuModel = {
    items: [
    {items: [{icon: "back", command: "do-previousPage"}]},
    {items: [{icon: "forward", command: "do-nextPage"}]}
    {items: [{icon: "save", command: "save"}]}
    ]
    };
    this.controller.setupWidget(Mojo.Menu.commandMenu, undefined, this.commandMenuModel);
  6. #6  
    From what I can gather looking at Mitch Allen's book, you can get that effect by having this.commandMenuModel.items[0].items contain both the forward and back arrows, have an empty object in this.commandMenuModel.items[1], and leave this.commandMenuModel.items[2] as-is.

    So something like this:
    Code:
    this.commandMenuModel = {
        items: [
            {items: [{icon: "back", command: "do-previousPage"}, {icon: "forward", command: "do-nextPage"}]},
            {},
            {items: [{icon: "save", command: "save"}]}
        ]
    };
    Or, using a more open formatting, you can see how this.commandMenuModel.items[0].items now has more than one item:
    Code:
    this.commandMenuModel = {
        items: [
            {
                items: [
                    {icon: "back", command: "do-previousPage"},
                    {icon: "forward", command: "do-nextPage"}
                ]
            },
            {},
            {items: [{icon: "save", command: "save"}]}
        ]
    };
    So now you'd manage the visibility of forward and back arrows by setting this.commandMenuModel.items[0].items to contain one, the other, or both.

    Keep in mind I haven't used it this way, so you may have to play around with it a bit, maybe check Palm's API documentation and sample code, or best yet find an open-source project that does it this way and look at their implementation.
  7. #7  
    Quote Originally Posted by thebounder View Post
    I want to have a button like you see in the browser for going back; you know the one with the arrows on.

    Can someone give me a code snippet for how I do it, please?

    Many thanks.
    If you're using this in a browser based app, it should be okay but I used this in a regular non-browser app and got my app rejected because Palm said that the user should simply use the "Back" gesture.

    Just a heads-up for you in case you're going to submit your app to the official Palm app catalog. Having your app rejected will cause about a week of delay.
    mobigamedepot.com

Posting Permissions