expand the hit area of a view - android

I have a small button on a view that I cannot make larger (movers and shakers don't want it larger). It's very hard to click on the button because of other views around it. At androiddevcon III Dave someone or another gave a talk on expanding the hit area of a view but he didn't include the code in his example. Now I'm trying to figure out how to actually implement this.
What i'm trying to do is fire a Button.onClick event if a click occurs within a larger rect. The following code seems to work in the 2.3.4 emulator(hard to tell because the emulator doesn't have the functionality i'm trying to test) but doesn't at all on a Motorolla phone running android 2.3.4.
View view=findViewById(R.id.Header);
view.setOnTouchListener(new OnTouchListener(){
public boolean onTouch(View v, MotionEvent event) {
Rect rect=new Rect();
Button btn=(Button)findViewById(R.id.btn1);
btn.getHitRect(rect);
util.scaleRect(rect);
if (rect.contains((int)event.getX(), (int)event.getY())){
event.setLocation(rect.exactCenterX(), rect.exactCenterY());
btn.dispatchTouchEvent(event);
return true;
}
else{
return false;
}
}
});

Related

Is there a offset between onTouchEvent and onTouchListener?

I have developed a game that shoots when player touches the screen by using onTouchListener for my custom SurfaceView and Thread.
But now I want to change the approach and instead of onTouchListener I added onTouchEvent to the SurfaceView o my Activity.
The problem is that I get some kind of offset when I click on the emulator.
Everything is working great, except that offset keeps appearing and I don't understand why.
Also let me mention that my app is running in landscape mode, maybe this is relevant.
I suspect that it isn't working properly because onTouchListener was added to the view and depended on it, but onTouchEvent doesn't depend on the view.
Also my view doesn't have any padding or margin properties, it is full-screen view (fill_parent).
Does anyone have any ideas on this?
I have done my application, and everything works correctly now, but i still do not know what the problem was.
After lots of debugging of my application the onTouchEvent returned random Y values that were always higher than the ones that the onTouchListener returned. And i am not sure why this is hapening since my view that recognizes the onTouchListener is a full-screen view.
So i figured out a way to get passed this by doing some math.
The first function that the android calls is the onTouch method which gives the correct values but just for one touch. I needed it to give right values even on the MotionEvent.ACTION_MOVE so i noticed that MotionEvent.ACTION_MOVE is actually doing correctly depending on the first touch recognized by the onTouchEvent.
So i just got the coordinate Y from the onTouch and the different coordinate with the offset from onTouchEvent calculated the difference and in every onTouchEvent from there, until the user lifts up their finger, i just subtract that difference and that gives me the correct value.
If anyone else has this problem, and doesn't know how to fix it, here is my code, maybe it will be helpful.
#Override
public boolean onTouchEvent(MotionEvent arg1) {
/*you can only touch when the thread is running*/
if(game.state() != STATE_PAUSE){
if(arg1.getAction() == MotionEvent.ACTION_DOWN){
coordinateX = arg1.getX();
coordinateY = arg1.getY();
differenceY = Math.abs(coordinateY - touchedY);
coordinateY = coordinateY - differenceY;
shootingIsOkay = true;
game.setDrawCircle(coordinateX,coordinateY);
}
if(arg1.getAction() == MotionEvent.ACTION_MOVE){
coordinateX = arg1.getX();
coordinateY = arg1.getY();
coordinateY = coordinateY - differenceY;
shootingIsOkay = true;
game.setDrawCircle(coordinateX,coordinateY);
}
if(arg1.getAction() == MotionEvent.ACTION_UP){
shootingIsOkay = false;
}
}
return false;
}
And the onTouch method that is called from the onTouchListener that depends on the view is just simple, here:
#Override
public boolean onTouch(View arg0, MotionEvent arg1) {
touchedY = arg1.getY();
return false;
}
If anyone knows how to fix this problem, please post your answer, i am very curious why this is happening

Why is getPointerCount() always returning 1?

An experiment in learning Android is to detect two-finger presses. I have an app that changes a custom ImageView to a random pic on a touch. That works fine. I now want it to only change the picture when two or more fingers press. I have an IF statement to only randomize the picture if pointerCount>1. It doesn't do anything.
I have my ASUS Transformer TF101 connected to the PC. I have a simple custom ImageView with an onTouch event.
public boolean onTouchEvent(MotionEvent event) {
int number =event.getPointerCount();
if (number > 1){
*randomise pic*
I examine the value of 'number' during a debug step-through (Log.d doesn't work for me from this ASUS :() and it's always 1 no matter how many fingers I touch with.
Any ideas?
(X) return false;
(X) return super.onTouchEvent(event);
(O) return true;

Android images and buttons

What should I use if I want to have buttons on an image? I mean, being able to click on certain points of an image and see some info.
What if I want to display text on that points? Imagine I am having a map of my neighbor for example, and I want some info to be displayed (for example my home). And if someone press on my home he could see further details, like my name, my phone and so on. The image(aka the map) will be stable, it wont change, like a background.
You'll have to implement the method onTouch from the interface OnTouchListener. For example:
OnTouchListener listener = new OnTouchListener() {
#Override
public false onTouch(View v, MotionEvent event) {
if(!event.getAction() == MotionEvent.ACTION_DOWN)
return false; //If the touch event was not putting the finger down on the screen, return false(Actions may be move, up, and so on)
final float x = event.getX();
final float y = event.getY();
if(x and y are in some range)
doFirstThing();
else if(x and y are in another range..)
doSecondThing();
//... and so on...
//In the end, you must return a boolean saying whether you "consumed" the event - if you handled the event or not.
}
}
And don't forget to set the listener as the OnTouchListener for your ImageView!
imageView.setOnTouchListener(listener);
I believe for what you are trying to achieve you don't need to use buttons. Instead, create a custom view, in your onDraw method draw the images and handle the onTouch events as Jong suggested. Once you detected a click on your home for example, you could create another view with info about it and display it to user.
For info on how to create custom view you may refer to this queestion for example. Google around for it

Images get pixelated when the screen is touched

I'm building a little game in HTML/JS on Android. I'm running into a problem on my HTC Desire (Android 2.2). When I touch the screen, all the images look pixelated and they get un-pixelated when the touch ends.
Here is a screenshot:
On the right it's when the screen is being touched. Can someone help me figure out what's causing this issue?
Notes:
No problems during the animations if the screen is not touched
I don't have this problem on my LG 540 Android 2.1
it seems images get a restricted number of colors when it's being touched
I'm using Phonegap
As far as I can tell, that "pixelated" behavior is an optimization made for scrolling (in Froyo and above). If the rendering is simplified, it makes things like the fling scroll animation require less processing.
If you need full browser functionality, I'm not sure you can help it much.
Since you've said you're making a game, however, I might have a workaround. I'm hoping your game doesn't need scroll (one full screen), so the scrolling optimization isn't necessary.
I've done a simple test with a WebView. On tap, as you mentioned, the rendering gets simplified, and things look a little off. Then once something is clicked (the WebView knows no more scrolling is taking place), things go back to normal.
I modified my Layout by replacing a WebView, with a FrameLayout. The FrameLayout contains the WebView and an invisible Button (on top). This Button grabs all the touch events. Then, I selectively choose what types of events the WebView should need, and pass them to the WebView. If a touch down and touch up happen close together, with no movement in betweeen, there's no reason for scrolling, so I haven't seen any of that "pixelated" behavior.
Because it was simplest for this example, I've chosen to detect the "MotionEvent.ACTION_UP" event, and when it's complete, I send a down first, so that it simulates a real click. You could certainly trigger on ACTION_DOWN, but you'll get more than one of those if the user swipes or something, and I wanted to keep the logic here simple. You can customize as you see fit, and probably with enough work, even enable scrolling in some cases. I hope the code below is enough to relay what I think works.
WebView wv = new WebView(this);
View dummyView = new Button(this);
dummyView.setBackgroundColor(0x00000000);
dummyView.setOnTouchListener(new OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_UP) {
MotionEvent down = MotionEvent.obtain(100, 100,
MotionEvent.ACTION_DOWN, event.getX(),
event.getY(), 0);
wv.onTouchEvent(down);
wv.onTouchEvent(event);
}
return false;
}
});
FrameLayout fl = new FrameLayout(this);
fl.addView(wv);
fl.addView(dummyView);
topLayout.addView(fl);
EDIT:
If you don't want to edit PhoneGap source, you might be able to do something like the following to change the PhoneGap layout... It's untested, but seems like it should work:
#Override
public void onCreate(Bundle arg0) {
super.onCreate(arg0);
super.loadUrl("file:///android_asset/www/index.html");
// Get the "root" view from PhoneGap
LinearLayout droidGapRoot = super.root;
// Create a new "root" that we can use.
final LinearLayout newRoot = new LinearLayout(this);
for (int i = 0; i < droidGapRoot.getChildCount(); i++) {
// Move all views from phoneGap's LinearLayout to ours.
View moveMe = droidGapRoot.getChildAt(i);
droidGapRoot.removeView(moveMe);
newRoot.addView(moveMe);
}
// Create an invisible button to overlay all other views, and pass
// clicks through.
View dummyView = new Button(this);
dummyView.setBackgroundColor(0x00000000);
dummyView.setOnTouchListener(new OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
// Only pass "UP" events to the specific view we care about, but
// be sure to simulate a valid "DOWN" press first, so that the
// click makes sense.
if (event.getAction() == MotionEvent.ACTION_UP) {
MotionEvent down = MotionEvent.obtain(100, 100,
MotionEvent.ACTION_DOWN, event.getX(),
event.getY(), 0);
newRoot.onTouchEvent(down);
newRoot.onTouchEvent(event);
}
return false;
}
});
// Layer the views properly
FrameLayout frameLayout = new FrameLayout(this);
frameLayout.addView(newRoot);
frameLayout.addView(dummyView);
// Add our new customized layout back to the PhoneGap "root" view.
droidGapRoot.addView(frameLayout);
}
I'm running into this same issue. One thing you could try is adding android:hardwareAccelerated="true" to your app's manifest in the tag. This stopped the problem for me, however now the whole app seems a little more pixelated overall on my device, so this might not be the best solution.
Check twice if your images have the same size in CSS in pixels as the files themselves. It seems to be somehow related. If I take a large image and re-scale it with a device-dependent generated CSS, I see the problem. Otherwise it's either not presented or not visible. Not sure if the original problem has been fixed in the latest Androids, but I still support 2.3, so hope it helps.

android need advice to start develop using gestures

I have a canvas.DrawText. I want to use gestures to dynamically change the text color and font. This is all working nice using a popup view class. But I want to make this more direct maybe using Fling scroll.
There are millions of colors and by sliding finger on the screen I thought I could increase/decrease the colorInteger and send it to paint.setColor(colorInteger ); before I draw. I have tried all day using various methods.
I have public boolean onTouchEvent(MotionEvent event) {
I know I must catch the x/y in MotionEvent.ACTION_DOWN
Wanted to use the screen left edge for color change and screen right for Font change. I have 21 ttf fonts.
The thing is, I see there is the OnGestureListener onscroll implementation but that will disable my onTouchEvent right? I have lots of movement going on in there.
public boolean onTouchEvent(MotionEvent event) {
Any idea?
You can use GestureDetector. Implement a GestureDetector.OnGestureListener and catch gestures there.
class MyActivity extends Activity implements GestureDetector.OnGestureListener {
// ....
gestureDetector = new GestureDetector(getContext(), this);
Provide GestureDetector with touch events like this:
#Override
public boolean onTouchEvent(MotionEvent event) {
if (gestureDetector.onTouchEvent(event))
return true;
else return super.onTouchEvent(event);
}
In GestureDetector.OnGestureListener's onDown you must return true if you want to process this gesture. E.g. then the user puts his finger donw in a specified area return true, and false otherwise. If false is returned here, complicated sequences (like fling or scroll) started with this event will not be detected.

Categories

Resources