I have added drag functinality to my custom editext by overriding the touchevent()
Now the problem is after the edittext is dragged and dropped in a particular position and i want to input text into the edittext by clicking on it, it still getting dragged maybe because the touch event has been overriden and keyboard does not appear to input text
The workaround maybe triggering the dragfunctionality on long press but now the default longpress functionality of the edittext may change
I dont want this to happen
What to do.
mainactivity.java
public class MainActivity extends Activity
{
RelativeLayout dropLayout;
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
dropLayout = (RelativeLayout) findViewById(R.id.ondraglayout);
dropLayout.setOnDragListener(new MyDragListener());
EditText et = (EditText) findViewById(R.id.mainEditText1);
}
}
my customedittext.java
public class CustomEdittext extends EditText
{
public CustomEdittext(Context context){
super(context);
}
public CustomEdittext(Context context, AttributeSet attr){
super(context, attr);
}
#Override
public boolean onTouchEvent(MotionEvent event)
{
switch(event.getAction()){
case MotionEvent.ACTION_DOWN :
break;
case MotionEvent.ACTION_MOVE :
ClipData dragdata = ClipData.newPlainText("","");
View.DragShadowBuilder shdwbldr = new View.DragShadowBuilder(this);
this.startDrag(dragdata, shdwbldr, this, 0);
this.setVisibility(View.INVISIBLE);
break;
}
return true;
}
}
mydraglistener.java
public class MyDragListener implements OnDragListener
{
private RelativeLayout.LayoutParams params;
#Override
public boolean onDrag(View v, DragEvent event)
{
View view = (View) event.getLocalState();
switch(event.getAction())
{
case DragEvent.ACTION_DRAG_STARTED:
params = (RelativeLayout.LayoutParams) view.getLayoutParams();
break;
case DragEvent.ACTION_DRAG_ENTERED:
int x = (int) event.getX();
int y = (int) event.getY();
break;
case DragEvent.ACTION_DRAG_EXITED :
break;
case DragEvent.ACTION_DRAG_LOCATION :
x= (int) event.getX();
y = (int) event.getY();
break;
case DragEvent.ACTION_DRAG_ENDED :
break;
case DragEvent.ACTION_DROP:
x = (int) event.getX();
y = (int) event.getY();
params.leftMargin = x;
params.topMargin = y;
view.setLayoutParams(params);
view.setVisibility(View.VISIBLE);
break;
default: break;
}
return true;
}
}
my main.xml
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#CDC2C0"
android:id="#+id/ondraglayout">
<com.mycompany.myapp.CustomEdittext
android:layout_height="wrap_content"
android:ems="10"
android:layout_width="wrap_content"
android:id="#+id/mainEditText1"/>
Your whole code not making sense at all: First let discuss what happening inside your onTouchEvent:
#Override
public boolean onTouchEvent(MotionEvent event)
{
switch(event.getAction()){
case MotionEvent.ACTION_DOWN :
break;
case MotionEvent.ACTION_MOVE :
ClipData dragdata = ClipData.newPlainText("","");
View.DragShadowBuilder shdwbldr = new View.DragShadowBuilder(this);
this.startDrag(dragdata, shdwbldr, this, 0);
this.setVisibility(View.INVISIBLE);
break;
}
return true;
When you put your finger in the screen, the system first trigger MotionEvent.ACTION_DOWN, and afterwards, she will deliver events of MotionEvent.ACTION_MOVE as long as nothing else in the system will consume this events. The meaning of this is your call for startDrag() will call on each movement of the finger, not really make sense right? So first I suggest you to move the code from MotionEvent.ACTION_MOVE into MotionEvent.ACTION_DOWN.
Now to the more important part. When you assign a DragListener to View, the meaning is that this View will receive all the DragEvent that the system will deliver as long as the Listener returns true for the DragEvent.ACTION_DRAG_STARTED.
Now, you assigned your DragListener, to the RelativeLayout. So lets look into your code:
case DragEvent.ACTION_DROP:
x = (int) event.getX();
y = (int) event.getY();
params.leftMargin = x;
params.topMargin = y;
view.setLayoutParams(params);
view.setVisibility(View.VISIBLE);
break;
You set new position for the LayoutParams, but who is the View that will receive this params? The RelativeLayout, not your EditText. Actually your EditText is now INVISBLE as you set it visibilty to INVISIBLE inside your onTouchEvent and never changed it back. Your code "view.setVisibility(View.VISIBLE);" inside the ACTION_DROP is not referring to the EditText but to the RelativeLayout. Unless there is other code you not shown here, this is the case.
Anyway, in your case I would recommend you to move your startDrag() call to a LongCLickListener. I have no clue which functionality of the EditText you think that may change ,as, at least as far as I know, there is no functionality for LongClick in EditText. If you want to avoid it you can also add a flag to your code and turn it on after the ACTION_DROP, and then make the code inside the ACTION_DOWN to run just if this flag is set to false.
Related
I know the question seems a bit vague, but I am creating an "alchemy" game whereby users drag different earthly elements onto one another to see what the combination produces.
At the moment, I can drag views around the screen, but I want them to be able to interact with each other. For example, when the user drags one ImageView onto another it will produce a new one, either programmatically or in some snazzy way...
I am just wondering what the best approach to this may be?
Here's my code so far, I've removed all the crap I had to show the barebones:
public class MainActivity extends AppCompatActivity {
private ImageView earthImg;
private ImageView waterImg;
private ViewGroup rootLayout;
private int _xDelta;
private int _yDelta;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
rootLayout = findViewById(R.id.root_view);
earthImg = rootLayout.findViewById(R.id.earthView);
waterImg = rootLayout.findViewById(R.id.waterView);
earthImg.setOnTouchListener(new UserTouchListener());
waterImg.setOnTouchListener(new UserTouchListener());
}
private final class UserTouchListener implements View.OnTouchListener {
float dX, dY;
public boolean onTouch(View view, MotionEvent event) {
switch (event.getAction() & MotionEvent.ACTION_MASK) {
case MotionEvent.ACTION_DOWN:
dX = view.getX() - event.getRawX();
dY = view.getY() - event.getRawY();
break;
case MotionEvent.ACTION_MOVE:
view.animate()
.x(event.getRawX() + dX)
.y(event.getRawY() + dY)
.setDuration(0)
.start();
break;
default:
return false;
}
rootLayout.invalidate();
return true;
}
}
<?xml version="1.0" encoding="utf-8"?>
<android.widget.RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/root_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.android.alchgame.MainActivity">
<ImageView
android:id="#+id/earthView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="59dp"
android:layout_marginStart="59dp"
android:layout_marginTop="70dp"
app:srcCompat="#drawable/earth_element"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<ImageView
android:id="#+id/waterView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/earthView"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="150dp"
android:layout_toEndOf="#+id/earthView"
android:layout_toRightOf="#+id/earthView"
app:srcCompat="#drawable/water_element" />
</android.widget.RelativeLayout>
I added the view above for reference
You could add MotionEvent.ACTION_UP to your switch statement, then calculate the bounds of the view you dragged based on the x and y co-ordinates (which you can get based on your dragging code) and the size of the view. Check if these numbers match the numbers of another view. If they do, you can then do whatever you need, like make a new image, delete the old ones, animate the dragged one back to where it started etc.
Additionally, views have getTop(), getLeft()... etc methods that will return that edge based on the parent.
So you could do something like:
case MotionEvent.ACTION_UP:
//view = view being dragged
String dTag = view.getTag();
for (View mView: myImageViews){
if (!mView.getTag().equals(dTag){
if (view.getTop() <= mView.getBottom() && view.getBottom() >= mView.getBottom()){
if (view.getLeft() <= mView.getRight() && view.getRight() >= mView.getRight()){
//match
}
else if (view.getRight() >= mView.getLeft() && view.getLeft() <= mView.getLeft()){
//match
}
//No match
}
else if (view.getBottom() >= mView.getTop() && view.getTop() <= mView.getTop()){
if (view.getLeft() <= mView.getRight() && view.getRight() >= mView.getRight()){
//match
}
else if (view.getRight() >= mView.getLeft() && view.getLeft() <= mView.getLeft()){
//match
}
//No match
}
}
}
break;
I'm not sure if there is some 'snazzy' way to do this in vanilla Android, but I'm sure there's probably some sort of library for exactly this, or you could do it manually as mentioned above.
Hopefully this has helped.
EDIT:
I'm assuming here that you will make an arraylist of your image views or similar. I would also like to point out that you will need to check if the current view in the loop is the one you are dragging, if it is, you should just move on to the next one. You could achieve this by adding a tag to each view and then checking if the tag matches the tag of the dragged view. I'll update the code above.
Extend View.OnDragListener and set it to a container of each "element"
class MyDragListener implements View.OnDragListener {
Drawable enterShape = getResources().getDrawable(...);
Drawable normalShape = getResources().getDrawable(...);
#Override
public boolean onDrag(View v, DragEvent event) {
View element = (View) event.getLocalState();
View elementContainer = (View) element.getParent();
switch (event.getAction()) {
case DragEvent.ACTION_DRAG_STARTED:
element.setVisibility(View.INVISIBLE);
break;
case DragEvent.ACTION_DRAG_ENTERED:
v.setBackground(enterShape);
break;
case DragEvent.ACTION_DRAG_EXITED:
v.setBackground(normalShape);
break;
case DragEvent.ACTION_DROP:
// Dropped, reassign Entry to Day
View newContainer = v;
doSnazzyStuff(element, newContainer);
break;
case DragEvent.ACTION_DRAG_ENDED:
v.setBackground(normalShape);
element.setVisibility(View.VISIBLE);
default:
break;
}
return true;
}
private void doSnazzyStuff(View element, View newContainer) {
// do stuff
}
}
and set something like this on each "element" to affect how it looks when it's dragged.
private final class ElementClickListener implements OnLongClickListener {
#Override
public boolean onLongClick(View view) {
ClipData data = ClipData.newPlainText("", "");
DragShadowBuilder shadowBuilder = new View.DragShadowBuilder(
view);
view.startDrag(data, shadowBuilder, view, 0);
return true;
}
}
If you create/extend custom views for your "element" and containers then you can do some pretty powerful stuff.
I have a layout with 2 LinearLayout. The first one is used as a container to contain a graph, and the second one contains few buttons.
When the app starts, at first instance the LinearLayout1 which contains the graph is hidden View.GONE.
Then when I touch a button from LinearLayout2, this layout goes back to its original place using a translate animation.
Finally, I should have the capability to hide again the LinearLayout1. I would like to achieve this by draggin up the LinearLayout2, so when the user has moved a bit upwards the LinearLayout2, the LinearLayouy1 would become again hidden by View.GONE.
This final part is the one with I need some help. I have tried something using an OnTochListener() but I haven't worked too much with this and i'm not sure about how to do it. This is code snnipet where I do this:
/*Layout views*/
private View graphContainer; //This is the LinearLayout1
private View valuesContainer; //This is the LinearLayout2
private float oldY;
private float newY;
...
valuesContainer.setOnTouchListener(new OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
float y = event.getY();
oldY = y;
break;
case MotionEvent.ACTION_MOVE:
float y2 = event.getRawY();
newY = y2;
if (oldY < newY) {
graphContainer.setVisibility(View.GONE);
}
break;
}
return true;
}
});
Depending on where I touch to do the movement I get to set the visibility to GONE, but the movement is not as I would like, I don't get to move the LinearLayout2.
What you did above is hiding layout2 when the user moves it's finger up.
You say that "you don't get to move the LinearLayout2" -> in order to move a view you need to update it's LayoutParams. You can see an example to this here : How to move a view in Android?
This way you can "push" layout2 up and at some point hide layout1 (using animation, or pushing layout1 as well). Hope this helps.
Edit (a requested code sample) :
BTW - animations transitions is the better way to go when view's params needs changing. It's not the answer to your question since you want a real "drag" feel (when going up).
Also - android L has some beautiful animations (I haven't used yet) that we should keep an eye on.
So... using a layout as follows :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context=".MyActivity">
<LinearLayout
android:id="#+id/first_layout"
android:background="#android:color/darker_gray"
android:layout_width="match_parent"
android:layout_height="100dp" >
</LinearLayout>
<LinearLayout
android:id="#+id/second_layout"
android:background="#android:color/holo_green_dark"
android:layout_width="match_parent"
android:layout_height="100dp" >
</LinearLayout>
</LinearLayout>
and a corresponding activity as follows :
public class MyActivity extends Activity {
int yDown = 0;
int initialTopMargin = 0;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_my);
LinearLayout layout2 = (LinearLayout)findViewById(R.id.second_layout);
layout2.setOnTouchListener(new View.OnTouchListener() {
#Override
public boolean onTouch(View view, MotionEvent event)
{
LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) view.getLayoutParams();
switch (event.getAction())
{
case MotionEvent.ACTION_MOVE:
params.topMargin = initialTopMargin - (yDown - (int)event.getRawY());
view.setLayoutParams(params);
break;
case MotionEvent.ACTION_DOWN:
yDown = (int)event.getRawY();
initialTopMargin = params.topMargin;
break;
}
return true;
}
});
}
}
how about using onDragListener ?
valuesContainer.setOnDragListener(new OnDragListener() {
#Override
public boolean onDrag(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
float y = event.getY();
oldY = y;
break;
case MotionEvent.ACTION_MOVE:
float y2 = event.getRawY();
newY = y2;
if (oldY < newY) {
graphContainer.setVisibility(View.GONE);
}
break;
}
return true;
}
});
The swipe of ViewPager is smooth inside the vertical scrollview when I add this code into my ViewPager.
mPager.setOnTouchListener(new View.OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
v.getParent().requestDisallowInterceptTouchEvent(true);
return false;
}
});
But when I add onClickListener to my ImageView [which is found in the Fragment added to the Adapter of the Viewpager], the swipe of my ViewPager is incorrect. Incorrect wherein I need to have a STRAIGHT HORIZONTAL LINE swipe for it to go to another page unlike before [when I did not add the onClickListener], the viewpager goes to the next page even I do DIAGONAL swiping. Any help is much appreciated. Thanks.
I just used setontouchlistener to my imageview and set conditions there.
Here's the code:
imgCarousel.setOnTouchListener(new OnTouchListener() {
#Override
public boolean onTouch(View arg0, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN: {
pStart = new Point((int) event.getX(), (int) event.getY());
break;
}
case MotionEvent.ACTION_UP: {
break;
}
case MotionEvent.ACTION_MOVE:{
break;
}
case MotionEvent.ACTION_CANCEL:{
Point pCancel = new Point((int) event.getX(), (int) event.getY());
int difference = pStart.x - pCancel.x;
if(difference > 10){
mPager.setCurrentItem(HomeCarousel.currentPage+1);
}
}
default:
break;
}
return true;
}
});
I think, it happens because ImageView intercept touchEvent using onClickListener.
You can use GestureOverlayView with your ImageView - http://developer.android.com/reference/android/gesture/GestureOverlayView.html
It could handle touch events without intercepting them.
I have xml in which I have 2 relative layouts, the first one is map(using map fragments) and the second one is ViewPager layout. I added button to map to hide map when clicked, now I want a method to get back the map layout by sweep down the screen.
I tried setting onTouchListener to relative layout but it is not working, also tried implementing OnTouchListener
public class MainActivity extends FragmentActivity implements OnTouchListener
it is not working! how to achieve this?
#Override
public boolean onTouch(View v, MotionEvent event) {
x= event.getX();
y=event.getY();
switch(event.getAction())
{
case MotionEvent.ACTION_DOWN:
sX = event.getX();
sY = event.getY();
break;
case MotionEvent.ACTION_UP:
fX = event.getX();
fY = event.getY();
if(fX-sX == 0 || fX-sX > 0 || fX-sX <0)
if(fY-sY < 0)
{
if(mapview.getVisibility()==View.GONE)
{
mapview.setVisibility(View.VISIBLE);
}
}
break;
}
return true;
}
Post your code, btw in simple way, ACTION_DOWN is when you touch the screen, ACTION_UP is when you finger release the screen. Look here
When I try to apply a translate animation on an ImageView, the image just completely disappears. I am not sure why this would happen because I ran this code through the eclipse debugger and the value for the x_start and x_final seem to be correct.
Any ideas on why this would be happening or how I can end up getting my TranslateAnimation to work?
chargeButton.setOnTouchListener(new View.OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
int x_cord = (int) event.getRawX();
int y_cord = (int) event.getRawY();
switch (event.getActionMasked()){
case MotionEvent.ACTION_DOWN:
break;
case MotionEvent.ACTION_MOVE:
chargeButton.setLayoutParams(setPosition(x_cord, false));
break;
case MotionEvent.ACTION_UP:
int x_start = x_cord;
x_cord = 0;
slowMove(x_start, x_cord, false);
chargeButton.setLayoutParams(setPosition(x_cord, false));
break;
default:
break;
}
return true;
}
});
}
public void slowMove(int x_start, int x_final, boolean pay)
{
Animation transAnimation = new TranslateAnimation(x_start, x_final, 0, 0);
transAnimation.setFillAfter(true);
transAnimation.setDuration(1000);
if (pay)
payButton.startAnimation(transAnimation);
else
{
chargeButton.clearAnimation();
chargeButton.startAnimation(transAnimation);
}
}
A little more background, this function is being called from an onTouchListener under the MotionEvent.ACTION_UP case.
I feel as though I need to use Animation.Relative_TO_SELF or something like that for the positioning. However, I am not sure how to do that when I only have the absoute positioning of the ImageViews.
Any and all ideas will be greatly appreciated.
Do not use the layout parameters to move your views - it is really not a good idea. I have been down that road and nothing good came out of it.
Consider extending View and setup your own custom view where you can have full control of what goes on.