Masking ImageButton images

Put problem concerning Views, Layouts and other XML-Resources (like AndroidManifest) here.

Masking ImageButton images

Postby Quetzalcoatl » Fri Oct 31, 2008 11:46 pm

Hi,

Does anybody happen to know how I can mask an image I wish to display on an ImageButton?

When I click on the button it shows the selection colour but the white background of the image I added to the ImageButton (via XML) is not transparent. Is there someway I can make either the white background of my image transparent or someway of adding an image mask so the only part of the image that is displayed when the image is selected is the green cross?

Cheers :)
Attachments
button.JPG
Image showing button as it is clicked on
button.JPG (1.74 KiB) Viewed 2428 times
Image
Quetzalcoatl
Senior Developer
Senior Developer
 
Posts: 129
Joined: Sat Oct 18, 2008 8:21 pm
Location: near Manchester, UK

Top

Postby Quetzalcoatl » Tue Nov 04, 2008 8:59 pm

Got it solved, not the way I would like it but at least it's a step in the right direction. I've got two separate images, one for when the button is not pressed and another for when it is. All I do is change the image when it is clicked on, I have had to cheat and make the white background of the green cross the same colour as the selected button. This gives a bit of a strange effect when releasing the mouse button but it's hardly noticable.

Code: Select all
mZoomIn.setOnTouchListener(new OnTouchListener() {

         @Override
         public boolean onTouch(View v, MotionEvent event) {
            // TODO change image to show highlight
            if (event.getAction() == MotionEvent.ACTION_DOWN)
            {
               //set the image to 'button clicked'
               mZoomIn.setImageResource(R.drawable.zoom_in2);
            }
            else if (event.getAction() == MotionEvent.ACTION_UP)
            {
               //set the image to 'button released'
               mZoomIn.setImageResource(R.drawable.zoom_in);
            }
            return false;
         }
        });


We can stop the framework showing the amber/orange colour around our images if we want by returning true, I assume this means "We've handled the button press no need for the framework to worry about any further action :D "
Attachments
buttons.JPG
buttons.JPG (2.37 KiB) Viewed 2419 times
Image
Quetzalcoatl
Senior Developer
Senior Developer
 
Posts: 129
Joined: Sat Oct 18, 2008 8:21 pm
Location: near Manchester, UK

Re: Masking ImageButton images

Postby narpDevelopments » Thu Jun 24, 2010 7:03 pm

Ok I've been looking for something like that to, more then anything to imitate the behavior of the ImageButton in twitter apk, the code is suppose to be launched soon.

Now the question, if you have Phones lets say, like all the HTC sold in Spain that the selected color is green and not the orange yellow from the standard ROM? what do you do. I'm been trying to find the solutions for that since a while by now.
narpDevelopments
Freshman
Freshman
 
Posts: 7
Joined: Thu Jan 28, 2010 10:32 am
Location: Barcelona

Re: Masking ImageButton images

Postby asolanki » Fri Jun 25, 2010 2:05 pm

Hey

there is another way too..
you can create own selector for any of your view

Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1. <selector xmlns:android="http://schemas.android.com/apk/res/android">
  2.     <item android:state_focused="true"  android:drawable="@drawable/cancelbuttonfocused" />
  3.      <item  android:state_pressed="true" android:drawable="@drawable/cancelbuttondown" />
  4.    
  5.     <item  android:drawable="@drawable/cancelbuttonnormal" />
  6. </selector>
Parsed in 0.001 seconds, using GeSHi 1.0.8.4


add this xml in your drawable folder and set it in your view's background

hope this is what you want
asolanki
Senior Developer
Senior Developer
 
Posts: 151
Joined: Thu Jan 08, 2009 7:32 am

Top

Return to View, Layout & Resource Problems

Who is online

Users browsing this forum: Majestic-12 [Bot], Yahoo [Bot] and 9 guests