Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Java Development

Reply
Developer
Posts: 798
Registered: ‎05-29-2012
My Device: see later
My Carrier: see later
Accepted Solution

horizontal scroll tabs

I have as u see in pic 3 tabs browse , new release top albums..

when on top albums,and scroll to  west i will delete  the tab browse and show tabs new release top albums top tracks...

 

package mypackage;

import net.rim.device.api.system.Bitmap;
import net.rim.device.api.system.Display;
import net.rim.device.api.system.EncodedImage;
import net.rim.device.api.system.GIFEncodedImage;
import net.rim.device.api.ui.Color;
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.FocusChangeListener;
import net.rim.device.api.ui.Graphics;
import net.rim.device.api.ui.Manager;
import net.rim.device.api.ui.MenuItem;
import net.rim.device.api.ui.TouchEvent;
import net.rim.device.api.ui.TouchGesture;
import net.rim.device.api.ui.UiApplication;
import net.rim.device.api.ui.component.BasicEditField;
import net.rim.device.api.ui.component.BitmapField;
import net.rim.device.api.ui.component.LabelField;
import net.rim.device.api.ui.component.SeparatorField;
import net.rim.device.api.ui.component.Status;
import net.rim.device.api.ui.container.HorizontalFieldManager;
import net.rim.device.api.ui.container.MainScreen;
import net.rim.device.api.ui.container.PopupScreen;
import net.rim.device.api.ui.container.VerticalFieldManager;
import net.rim.device.api.ui.decor.Background;
import net.rim.device.api.ui.decor.BackgroundFactory;

public class TabControl extends MainScreen implements FocusChangeListener {
	private BGVerticalFieldManager mainManager = new BGVerticalFieldManager(EncodedImage.getEncodedImageResource("bck-back.png"));
	private LabelField tab1;
    private LabelField tab2;
    private LabelField tab3;
    private LabelField tab4;
    private LabelField spacer1;
    private LabelField spacer2;
    private LabelField spacer3;
    private VerticalFieldManager tabArea;
    private LabelField tab1Heading;
    private BasicEditField tab1Field1;
    private BasicEditField tab1Field2;
    private LabelField tab2Heading;
    private BasicEditField tab2Field1;
    private BasicEditField tab2Field2;
    private LabelField tab3Heading;
    private BasicEditField tab3Field1;
    private BasicEditField tab3Field2;
    private VerticalFieldManager tab1Manager;
    private VerticalFieldManager tab2Manager;
    private VerticalFieldManager tab3Manager;
    private VerticalFieldManager tab4Manager;
 	HorizontalFieldManager hManager = new HorizontalFieldManager(Field.USE_ALL_WIDTH )
 	{
 		protected void sublayout(int maxWidth, int maxHeight) {
 			// TODO Auto-generated method stub
 			setExtent(Display.getWidth(), maxHeight);
 			super.sublayout(Display.getWidth(), maxHeight);
 		}
 	};
    int tabNum  = 1;
	 public TabControl(int id) {
     	super(NO_VERTICAL_SCROLL | NO_VERTICAL_SCROLLBAR);
     	

     	
     	BitmapField xo1 = new BitmapField(Bitmap.getBitmapResource("logo.png"),Manager.FIELD_VCENTER)
        {
        	protected boolean navigationClick(int status, int time) {
        		
        		return super.navigationClick(status, time);
        	}
        };
        Background bg = BackgroundFactory.createBitmapBackground(Bitmap.getBitmapResource("header.png"));
      
     	hManager.setBackground(bg);
     	hManager.add(xo1);

        tab1 = new LabelField("Browse", LabelField.FOCUSABLE | LabelField.HIGHLIGHT_SELECT | FIELD_VCENTER){
        	protected boolean navigationClick(int status,int time){
        		mainManager.delete(tabArea);
                tabArea = displayTab1();
                mainManager.add(tabArea);
               return true;
           }
        	public void paint(Graphics g){      
                //g.setBackgroundColor(Color.BLACK);
              //  g.fillRect(0,0,getWidth(),getHeight());
                g.setColor(Color.WHITE);
              //  g.clear();
                super.paint(g);
        }
       	protected void layout(int width, int height) {
               super.layout(width, height);
           //    this.setExtent(this.getWidth(), 60);
               this.setMargin( ( getHeight() - this.getPreferredHeight()), 0, 0, (getWidth() - this.getPreferredWidth()));
           }
       };
        tab2 = new LabelField("New Release", LabelField.FOCUSABLE | LabelField.HIGHLIGHT_SELECT | FIELD_VCENTER){
        	protected boolean navigationClick(int status,int time){
        		mainManager.delete(tabArea);
                tabArea = displayTab2();
                mainManager.add(tabArea);
                
               return true;
           }
        	public void paint(Graphics g){      
               // g.setBackgroundColor(Color.BLACK);
             //   g.fillRect(0,0,getWidth(),getHeight());
                g.setColor(Color.WHITE);
              //  g.clear();
                super.paint(g);
        }
       	protected void layout(int width, int height) {
               super.layout(width, height);
           //    this.setExtent(this.getWidth(), 60);
               this.setMargin( ( getHeight() - this.getPreferredHeight()), 0, 0, (getWidth() - this.getPreferredWidth()));
           }
       };
        tab3 = new LabelField("Top Albums", LabelField.FOCUSABLE | LabelField.HIGHLIGHT_SELECT | FIELD_VCENTER){
        	protected boolean navigationClick(int status,int time){
        		mainManager.delete(tabArea);
                tabArea = displayTab3();
                mainManager.add(tabArea);
              
               
               return true;
           }
        	public void paint(Graphics g){      
              //  g.setBackgroundColor(Color.BLACK);
               // g.fillRect(0,0,getWidth(),getHeight());
                g.setColor(Color.WHITE);
               // g.clear();
                super.paint(g);
        }
       	protected void layout(int width, int height) {
               super.layout(width, height);
           //    this.setExtent(this.getWidth(), 60);
               this.setMargin( ( getHeight() - this.getPreferredHeight()), 0, 0, (getWidth() - this.getPreferredWidth()));
           }
       };
       
       
      
      
       
       tab4 = new LabelField("Top Tracks", LabelField.FOCUSABLE | LabelField.HIGHLIGHT_SELECT | FIELD_VCENTER){
       	protected boolean navigationClick(int status,int time){
       		mainManager.delete(tabArea);
               tabArea = displayTab4();
               mainManager.add(tabArea);
             
              
              return true;
          }
       	public void paint(Graphics g){      
             //  g.setBackgroundColor(Color.BLACK);
              // g.fillRect(0,0,getWidth(),getHeight());
               g.setColor(Color.WHITE);
              // g.clear();
               super.paint(g);
       }
      	protected void layout(int width, int height) {
              super.layout(width, height);
          //    this.setExtent(this.getWidth(), 60);
              this.setMargin( ( getHeight() - this.getPreferredHeight()), 0, 0, (getWidth() - this.getPreferredWidth()));
          }
      };
      
        spacer1 = new LabelField(" | ", LabelField.NON_FOCUSABLE | FIELD_VCENTER);
        spacer2 = new LabelField(" | ", LabelField.NON_FOCUSABLE | FIELD_VCENTER);
        spacer3 = new LabelField(" | ", LabelField.NON_FOCUSABLE | FIELD_VCENTER);
       // setPadding(int top, int right, int bottom, int left)
        tab1.setFocusListener(this);
        tab2.setFocusListener(this);
        tab3.setFocusListener(this);
        tab4.setFocusListener(this);
        hManager.add(tab1);
        hManager.add(spacer1);
        hManager.add(tab2);
        hManager.add(spacer2);
        hManager.add(tab3);
      //  hManager.add(spacer3);
       // hManager.add(tab4);

        mainManager.add(hManager);
        mainManager.add(new SeparatorField());

        tab1Manager = new VerticalFieldManager();
        tab2Manager = new VerticalFieldManager();
        tab3Manager = new VerticalFieldManager();

        tabArea = displayTab1();
        EncodedImage eih12 = EncodedImage.getEncodedImageResource("header+logo.png");
        //EncodedImage my1 = EncodedImage.createEncodedImage(_bitmap1, 0, _bitmap1.getWidth());
        final EncodedImage _bitmap22 = MAMClient.sizeImage(eih12,Display.getWidth(), 50);
        Bitmap obj2 = _bitmap22.getBitmap();
       // setTitle( new BitmapField(obj2, Field.FIELD_HCENTER | Field.NON_FOCUSABLE));
        mainManager.add(tabArea);
        //add(tabArea);
     	add(mainManager);  
     	addMenuItem(logIn);
	 }
	 public void focusChanged(Field field, int eventType) {
         if (tabArea != null) {
             if (eventType == FOCUS_GAINED) {
                 if (field == tab1) {
                     System.out.println("Switch to Tab 1");
                     mainManager.delete(tabArea);
                     tabArea = displayTab1();
                     mainManager.add(tabArea);
                 } else if (field == tab2) {
                     System.out.println("Switch to Tab 2");
                     System.out.println("Switch to Tab 1");
                     mainManager.delete(tabArea);
                     tabArea = displayTab2();
                     mainManager.add(tabArea);
                 } else if (field == tab3) {
                     System.out.println("Switch to Tab 3");
                     System.out.println("Switch to Tab 1");
                     mainManager.delete(tabArea);
                     tabArea = displayTab3();
                     mainManager.add(tabArea);
                 }
                 else if (field == tab4) {
                     System.out.println("Switch to Tab 3");
                     System.out.println("Switch to Tab 1");
                     mainManager.delete(tabArea);
                     tabArea = displayTab4();
                     mainManager.add(tabArea);
                 }
             }
         }

     }

	 private MenuItem logIn = new MenuItem("Log In", 110, 10)
     {
         public void run()
         {
            // Dialog.inform("PlayList Page");
         	//UiApplication.getUiApplication().pushScreen(new PlayList(-1));
         	 
         	
         	UiApplication.getUiApplication().pushScreen(new SignIn());
         }
     };
     public VerticalFieldManager displayTab1() {
    	 HorizontalFieldManager popHF = new HorizontalFieldManager();
         // popHF.add(new LabelField("Pls wait..."));
          final PopupScreen waitScreen = new PopupScreen(popHF);
          Thread threadToRun = new Thread() 
          {
              public void run() 
              {

                  synchronized (UiApplication.getEventLock()) 
                  {
                  	HorizontalFieldManager loadingManager = new  HorizontalFieldManager(Manager.FIELD_HCENTER);
                  	final GIFEncodedImage ourAnimation = (GIFEncodedImage) GIFEncodedImage.getEncodedImageResource("gif-loading.agif");
                  	
                  	

                  	AnimatedGIFField  _ourAnimation = new AnimatedGIFField(ourAnimation, Field.FIELD_HCENTER);

                  	_ourAnimation.setMargin(4, 10, 0, 0);
                      loadingManager.setMargin(0, 0, 7, 0);
                      loadingManager.add(_ourAnimation);
                      waitScreen.add(loadingManager);
                      
                  	UiApplication.getUiApplication().pushScreen(waitScreen);
                  }
                  synchronized(GlobalValue.getTop20)
                  {
			        	/*if(GlobalValue.getGetTop20().size() == 0)
			        		MAMClient.getTop20(GlobalValue.getGetTop20(), catId);*/
                  }
          synchronized (UiApplication.getEventLock()) 
           {
               UiApplication.getUiApplication().popScreen();
			  	final VerticalFieldManager Content= new VerticalFieldManager(Manager.USE_ALL_WIDTH|Manager.VERTICAL_SCROLL);
					Content.setMargin(5,0,0,0);
					int mas  = 0 ;
					while(mas < GlobalValue.getGetTop20().size())
					{
						//Song temp = (Song) GlobalValue.getGetTop20().elementAt(mas);
						//Content.add(new A_AddSingersFM(temp.songId, temp.songName, false,temp.albumCover,temp,-1, tb, logIn,logOut,1,0,0, Register));
						
						mas++;
					}
					tab1Manager.deleteAll();
				    tab1Manager.add(Content); 
           }
          return;
        }
              
    };
    			threadToRun.start();
         return tab1Manager;
     }

     public VerticalFieldManager displayTab2() {
         if (tab2Heading == null) {
             tab2Heading = new LabelField("Password Recovery");
             tab2Manager.add(tab2Heading);
         }
         if (tab2Field1 == null) {
             tab2Field1 = new BasicEditField("Security Question: ", "Mother's Maiden Name?");
             tab2Manager.add(tab2Field1);
         }
         if (tab2Field2 == null) {
             tab2Field2 = new BasicEditField("Password: ", "");
             tab2Manager.add(tab2Field2);
         }
         return tab2Manager;
     }

     public VerticalFieldManager displayTab3() {
         if (tab3Heading == null) {
             tab3Heading = new LabelField("Interests");
             tab3Manager.add(tab3Heading);
         }
         if (tab3Field1 == null) {
             tab3Field1 = new BasicEditField("Hobbies: ", "");
             tab3Manager.add(tab3Field1);
         }
         if (tab3Field2 == null) {
             tab3Field2 = new BasicEditField("Memberships: ", "");
             tab3Manager.add(tab3Field2);
         }
         return tab3Manager;
     }
     public VerticalFieldManager displayTab4() {
         
         return tab4Manager;
     }
     protected boolean touchEvent(TouchEvent message)
 	{
 		try
 		{
 			int eventCode = message.getEvent();
 	
 			if(eventCode == TouchEvent.GESTURE){
 				TouchGesture g = message.getGesture();
 				int gesturecode = g.getEvent();
 				switch(gesturecode) {	    		
 		    		case TouchGesture.SWIPE:
 						int direction = g.getSwipeDirection();
 					if(direction == TouchGesture.SWIPE_EAST)
 					{
 		
 						if(tabNum == 3)
 						{
 							tabNum = 2;
 							tab2.setFocus();
 							return super.touchEvent(message);
 						}
 						else if(tabNum == 2)
 						{
 							tabNum = 1;
 							tab1.setFocus();
 							return super.touchEvent(message);
 						}
 						else if(tabNum == 4)
 						{
 							tabNum = 3;
 							hManager.replace(tab2, tab1);
							hManager.replace(tab3,tab2);
							hManager.replace(tab4, tab3);
 							tab3.setFocus();
 							
 							return super.touchEvent(message);
 						}
 					}
 					else if(direction == TouchGesture.SWIPE_WEST)
 					{
 		
 						if(tabNum == 1)
 						{
 							
 									//delete(tabArea);
 									//tabArea = displayTab2();
 									//add(tabArea);
 									//tab2.setFocus();
 									tabNum = 2;
 									tab2.setFocus();
 									
 									return super.touchEvent(message);
 						}
 						else if(tabNum == 2)
 						{
 							
 								//delete(tabArea);
 								//tabArea = displayTab1();
 								//add(tabArea);
 								tabNum = 3;
 								tab3.setFocus();
 								return super.touchEvent(message);
 						
 						} 
 						else if(tabNum == 3)
 						{
 							
 								//delete(tabArea);
 								//tabArea = displayTab1();
 								//add(tabArea);
 
 								hManager.replace(tab3, tab4); hManager.replace(tab2,tab3); hManager.replace(tab1, tab2); tabNum = 4; tab4.setFocus();
 								return super.touchEvent(message);
 						
 						} 
 					}
 					break;
 				}
 			}
 				//The touch event was not consumed.
 				return super.touchEvent(message);
 		}
 		catch(Exception eol)
 		{
 			return super.touchEvent(message);
 		}
 	}
 	public void close()
     {
 		setDirty(false);
         super.close();
     } 
 }

 

 

what happens is this

first tab http://s10.postimage.org/eh6txxrrr/Untitled.png

 

scroll to the west, and go to second tab http://s10.postimage.org/p5akws1qv/Untitled2.png

scroll to the west, and go to third tab http://s10.postimage.org/lzukkb8if/Untitled3.png

 

scroll to the west, now i gotta delete browse tab...move new release + top albums to left..and add  top tracks tab.

what happen is this http://s10.postimage.org/t4cdtcfrr/Untitled5.png

 

why doesnt top track appear at the end? and it coincides there instead? I bolded the code part for my last action.

 

 

Developer
Posts: 798
Registered: ‎05-29-2012
My Device: see later
My Carrier: see later

Re: horizontal scroll tabs

I know why it happened, and i fixed it.

 

 

coz labeliefield browse is  6 letters, when i add top tracks its more letters...

so it doesnt fit in the places i gave. more space is needed..i fixed it .

Developer
Posts: 16,687
Registered: ‎07-29-2008
My Device: Z10 LE, Z30, Passport
My Carrier: O2 Germany

Re: horizontal scroll tabs

happened to me sometimes as well, i summarized my issue for a forum post and voila, found the solution.
----------------------------------------------------------
feel free to press the like button on the right side to thank the user that helped you.
please mark posts as solved if you found a solution.
@SimonHain on twitter