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: 214
Registered: ‎03-18-2012
My Device: 8520
My Carrier: Company

How to HighLight the BitmapField That as the Focus

Hi,

      Is ther any way to highlight the bitmapFiled that As the focus.

    

i am doing->on focus I change the Background Color but it doesnot effect the Bitmap (image )Color....

       

Trusted Contributor
Posts: 151
Registered: ‎06-17-2010
My Device: Curve 8900
My Carrier: Vodafone

Re: How to HighLight the BitmapField That as the Focus

[ Edited ]

Hi Ashish12169,

 

Here is the link of CustomButtonField. Use this class and provide text and bitmap that you want.

 

http://swati-blackberry.blogspot.in/2011/01/how-to-create-custom-button-field-in.html

 

Thanks,

Albert Anks

----------------------------------------------------------
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.

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

Re: How to HighLight the BitmapField That as the Focus

we use two mechanisms, one option is to provide a focus bitmap (second image), another is to alpha-blend the bitmap.
----------------------------------------------------------
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
Developer
Posts: 19,636
Registered: ‎07-14-2008
My Device: Not Specified

Re: How to HighLight the BitmapField That as the Focus

[ Edited ]

Or add some padding around the Bitmap and you will see a focus 'border' (but this can be dodgy with transparent images). 

 

Or overide paint() and drawFocus() to paint a border on the Bitmap for the focused Bitmap. 

 

The question really is how would you like to highlight the BitmapField that has focus?

Developer
Posts: 180
Registered: ‎12-09-2011
My Device: 9360, BB10
My Carrier: Aircel

Re: How to HighLight the BitmapField That as the Focus

You can draw the focus arround the particular bitmap whom you want to show as focusable.

 

protected void drawFocus(Graphics graphics, boolean on)
{
if(on)
{
graphics.setColor(Color.BLUE);
int width = this.getWidth();
int height = this.getHeight();

graphics.fillRect(0, 0, width, 1);
graphics.fillRect(width-1, 0, 1, height);
graphics.fillRect(0, height-1, width, 1);
graphics.fillRect(0, 0, 1, height);
}
};

Developer
Posts: 285
Registered: ‎08-26-2011
My Device: 9900
My Carrier: Not Specified

Re: How to HighLight the BitmapField That as the Focus

If you are having two images(means one for normal image and another for Highlighted) then below is better: 

 

I am taking the PictureBackgroundButtonField.java from this below LINK and modify somthing which may helps you:

 

PictureBackgroundButtonField

 

 

/**
 * PictureBackgroundButtonField.java
 *
 * Copyright © 1998-2009 Research In Motion Ltd.
 * 
 * Note: For the sake of simplicity, this sample application may not leverage
 * resource bundles and resource strings.  However, it is STRONGLY recommended
 * that application developers make use of the localization features available
 * within the BlackBerry development platform to ensure a seamless application
 * experience across a variety of languages and geographies.  For more information
 * on localizing your application, please refer to the BlackBerry Java Development
 * Environment Development Guide associated with this release.
 */

package com.kflicks.ui.Custom;

import net.rim.device.api.ui.*;
import net.rim.device.api.system.*;

/**
 * Custom button field that shows how to use images as button backgrounds.
 */
public class PictureBackgroundButtonField extends Field 
{       
    private String _label;
    private int _labelHeight;
    private int _labelWidth;
    private Font _font;
    
    private Bitmap _currentPicture;
    private Bitmap _onPicture;
    private Bitmap _offPicture;
        
    /**
     * Constructor.
     * @param text - the text to be displayed on the button
     * @param style - combination of field style bits to specify display
           attributes 
     */
    public PictureBackgroundButtonField(Bitmap onPicture, Bitmap offPicture, String text, long style) 
    {
        super(style);
        
        _font = getFont();
        _label = text;
        _labelHeight = _font.getHeight();
        _labelWidth = _font.getAdvance(_label);
        _currentPicture = _onPicture;
		_onPicture=onPicture;
		_offPicture=offPicture;
    }
    
    /**
     * @return The text on the button
     */
    String getText()
    {
        return _label;
    }
    
    /**
     * Field implementation.
     * @see net.rim.device.api.ui.Field#getPreferredHeight()
     */
    public int getPreferredHeight() 
    {
        return _labelHeight + 4;
    }

    /**
     * Field implementation.
     * @see net.rim.device.api.ui.Field#getPreferredWidth()
     */
    public int getPreferredWidth() 
    {
        return _labelWidth + 8;
    }
    
    /**
     * Field implementation.  Changes the picture when focus is gained.
     * @see net.rim.device.api.ui.Field#onFocus(int)
     */
    protected void onFocus(int direction) 
    {
        _currentPicture = _onPicture;
        invalidate();
    }

    /**
     * Field implementation.  Changes picture back when focus is lost.
     * @see net.rim.device.api.ui.Field#onUnfocus()
     */
    protected void onUnfocus() 
    {
        _currentPicture = _offPicture;
        invalidate();
    }
    
    /**
     * Field implementation.  
     * @see net.rim.device.api.ui.Field#drawFocus(Graphics, boolean)
     */
    protected void drawFocus(Graphics graphics, boolean on) 
    {
        // Do nothing
    }
    
    /**
     * Field implementation.
     * @see net.rim.device.api.ui.Field#layout(int, int)
     */
    protected void layout(int width, int height) 
    {
        setExtent(Math.min( width, getPreferredWidth()), 
        Math.min( height, getPreferredHeight()));
    }

    /**
     * Field implementation.
     * @see net.rim.device.api.ui.Field#paint(Graphics)
     */
    protected void paint(Graphics graphics) 
    {       
        // First draw the background colour and picture
        graphics.setColor(0x00EE3526);
        graphics.fillRect(0, 0, getWidth(), getHeight());
        graphics.drawBitmap(0, 0, getWidth(), getHeight(), _currentPicture, 0, 0);
        
        // Then draw the text
        /*graphics.setColor(Color.BLACK);
        graphics.setFont(_font);
        graphics.drawText(_label, 4, 2, 
            (int)( getStyle() & DrawStyle.ELLIPSIS | DrawStyle.HALIGN_MASK ),
            getWidth() - 6 );*/
    }
        
    /**
     * Overridden so that the Event Dispatch thread can catch this event
     * instead of having it be caught here..
     * @see net.rim.device.api.ui.Field#navigationClick(int, int)
     */
    protected boolean navigationClick(int status, int time) 
    {
        fieldChangeNotify(1);
        return true;
    }
    
}

 

and use like this:
 

PictureBackgroundButtonField pic = new PictureBackgroundButtonField(onBitmap,offBitmap,"Hello", DrawStyle.HCENTER);//With text
hfmBottom.add(pic);

or

PictureBackgroundButtonField pic = new PictureBackgroundButtonField(onBitmap,offBitmap,"", DrawStyle.HCENTER);//Without Text
hfmBottom.add(pic);

 May be this helps you;

 

=================================================================================
Feel free to click LIKE button if the solution helps you;
--
Regards,

ALI SHAIK.
Developer
Posts: 2,268
Registered: ‎07-08-2009
My Device: various
My Carrier: various

Re: How to HighLight the BitmapField That as the Focus

Since BitmapField takes exactly the size of the underlying image, you need to change that image somehow to indicate focus.  Simon Hain has given you two good options.

 

Still, if you don't want to override any methods or create new classes, there is another, very simple way: use borders to indicate focus!

 

Take a look at Field.setBorder(int, Border, boolean). You can define different borders for VISUAL_STATE_NORMAL and VISUAL_STATE_FOCUS (different colors is the simplest way) and, if their dimensions are the same, specify updateLayout as false for better efficiency. Then the framework will take care of switching borders for you.

----------------------------------------------------------
please click 'Accept Solution' on posts that provide the solution to the question you've posted. Don't say "Thanks", press 'Like' button instead!
New Developer
Posts: 10
Registered: ‎08-24-2012
My Device: 9820
My Carrier: Airtel

Re: How to HighLight the BitmapField That as the Focus

U can also use setBorder  method of bitmap field.