Skip to main content

Blackberry Creating Toolbar Part 1

Update  Oct-9-2012

* I think i should make this tutorial into parts. Part 1 should be for beginner, the higher part should be for advanced coder *
-----------------------------------------------------------------------------------------------------
Requirements :

- BlackBerry OS 5

Right now I want to create Toolbar just like this

 
What i really want to create Toolbar with Back Button, Screen Name and some Align Right Button or Text. and of course with fixed position.


Right now i don't really have a solution to create amazing toolbar but right now I'm using GridFieldManager to create a simple toolbar. but I'll update this soon i got the solution and i hope with a cool layout.

This is the First Code

// CODE SUPPOSED TO BE HERE
import net.rim.device.api.system.Display;
import net.rim.device.api.ui.DrawStyle;
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.FieldChangeListener;
import net.rim.device.api.ui.Font;
import net.rim.device.api.ui.FontFamily;
import net.rim.device.api.ui.component.ButtonField;
import net.rim.device.api.ui.component.Dialog;
import net.rim.device.api.ui.component.LabelField;
import net.rim.device.api.ui.container.GridFieldManager;
import net.rim.device.api.ui.container.MainScreen;

public class HeaderTest extends MainScreen {

    /**
     * 
     */
    public HeaderTest() {
        super(MainScreen.VERTICAL_SCROLL | MainScreen.VERTICAL_SCROLLBAR);
        // TODO Auto-generated constructor stub
        HeaderStyle1();
        
    }
    
    public void HeaderStyle1(){
        /*
         * This Style Should be Consist <backButton> ScreenName <otherButton>
         * And Using GridFieldManager
         */
        GridFieldManager gfm = new GridFieldManager(1, 3, 0);
        //gfm.setBorder(BorderFactory.createSimpleBorder(new XYEdges(0,0,0,0),Border.STYLE_DASHED));
        
        int columnWidth1 = (int) ((Display.getWidth() * 0.2) - gfm.getColumnPadding());
        int columnWidth2 = (int) ((Display.getWidth() * 0.6) - gfm.getColumnPadding());
        int columnWidth3 = (int) ((Display.getWidth() * 0.2) - gfm.getColumnPadding());
        //int totalCol = gfm.getColumnCount();
//         for(int i = 0; i < totalCol; i++) {
//            gfm.setColumnProperty(i, GridFieldManager.FIXED_SIZE, columnWidth);
//         }
        //gfm.setBackground(BackgroundFactory.createSolidBackground(0xA3080C));
        gfm.setColumnProperty(0, GridFieldManager.FIXED_SIZE, columnWidth1);
        gfm.setColumnProperty(1, GridFieldManager.FIXED_SIZE, columnWidth2);
        gfm.setColumnProperty(2, GridFieldManager.FIXED_SIZE, columnWidth3);
        gfm.isStyle(GridFieldManager.USE_ALL_WIDTH);
        ButtonField backButton = new ButtonField("Back",ButtonField.CONSUME_CLICK | DrawStyle.ELLIPSIS);
        gfm.add(backButton);
        
        LabelField labelTitle = new LabelField("Screen Name");
        Font myFont = labelTitle.getFont();
        FontFamily fontFam;
        try {
            fontFam = FontFamily.forName("System");
            myFont = fontFam.getFont(Font.BOLD,28);
        } catch (ClassNotFoundException e) {
            // TODO Auto-generated catch block
            //e.printStackTrace();
        }
        labelTitle.setFont(myFont);
        gfm.add(labelTitle);
        ButtonField cartButton = new ButtonField("Cart",ButtonField.CONSUME_CLICK | DrawStyle.ELLIPSIS);
        gfm.add(cartButton);
        
        FieldChangeListener backBtnListener = new FieldChangeListener() {
            
            public void fieldChanged(Field field, int context) {
                // TODO Auto-generated method stub
                Dialog.inform("Back Button is Pushed");
            }
        };
        backButton.setChangeListener(backBtnListener);
        
        FieldChangeListener cartBtnListener = new FieldChangeListener() {
            
            public void fieldChanged(Field field, int context) {
                // TODO Auto-generated method stub
                Dialog.inform("Cart Button is Pushed");
            }
        };
        cartButton.setChangeListener(cartBtnListener);
        add(gfm);
    }
    
    public boolean onClose() {
        setDirty(false);
        return super.onClose();
    }
    
}


This is my First Result


As you see the code i'm using GridFieldManager to handle Fields (Button Field, Label Field, etc). Other things is pretty much simple.

Thanks.

See the Part 2 of the tutorial. the part 2 will be using a simple style to create colorfull toolbar. well its not really colorful. i just add background color.. :p

Go to Part 2

Comments

Popular posts from this blog

JavaScript Real Time Calculation

I've been around looking for javascript that can do Real Time Calculation. javascript real time calculation, javascript real time calculation textbox. by some lucky keywords i found this code. this is exactly the code that i want. it really do the real time calculation. and it doesn't need onChange or OnBlur function. Just try it Example + = this is the javascript code <script type='text/javascript' > function startCalc(){   interval = setInterval("calc()",1); } function calc(){   one = document.autoSumForm.firstBox.value;   two = document.autoSumForm.secondBox.value;   document.autoSumForm.thirdBox.value = (one * 1) + (two * 1); } function stopCalc(){   clearInterval(interval); } </script> this is the html code <form name="autoSumForm">   <input class="right" type=text name="firstBox" value="" onFocus="startCalc();" onBlur="stopCalc();"><br...

iOS 5 Creating eCommerce with Shopping Cart App Part 1

[Created 11-28-2012] it seems like there are tons of tutorial ios and xcode for beginner out there. you can view the list at my post here http://javalearning-adventure.blogspot.com/2012/11/learning-xcode.html that's the link that i always update if i find anything. this tutorial will consist of step by step in creating Shopping Cart App. There will be Browse Product, Shopping Cart, and Checkout Method. I will update these later after i satisfied with the end result. These tutorial will also include web programming using php. but these php will only using basic sample not the very complex with mysql database and everything. these php pages will only creating json output. i think you don't need to learn php and json. you should only learn how to handle json using objective-c. I am still a beginner in xcode and objective-c, its still only 1 month since i started these tutorial. requirements suppose to be iOS 5 with xcode 4. [i will update these later][postponed...

BlackBerry ListField Tutorial Part 3

This Part 3 will consist of Networking, ListField, JSON and Thread. I'm really sorry for pending this part 3. I've been busy making money and still failed. Its just really hard to live in third world country by coding. anyway, There are few Library that you will need creating ListField with JSON data, but we wont touch that area first. we need to learn the basic. * note added : Aug 26 2013 The basic should be : Networking Thread ListField [if i find anything, will be add here]