Scale and position in bitmap overlay - android

I am working on a screen that allows user to drag and drop one image onto another. After that the code should be able to redisplay the resulting image. I am having a hard time making the reddit image normal size. More details about it is in bold next to screen 3 below.
Note: all of my images so far are in the res/drawable folder.
Screen 1: Initial screen:
Screen 2: After the reddit image was dragged and dropped onto another image:
Screen 3: Here is what the screen looks like after I create an overlay bitmap with 2 bitmaps combined (notice the reddit image that is now smaller than the original dimensions). NOTE: If I create a temporary bitmap for the reddit image alone (instead of combining it into an overlay with the other bitmap), the reddit icon has correct width and height. This question is only about the dimensions of reddit not about the placement of the icon within the overlay.
Here is my layout file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:weightSum="1"
android:orientation="vertical"
tools:context=".LobbyActivity">
<FrameLayout
android:id="#+id/source_layout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".5">
<ImageView
android:id="#+id/flatStanleyImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/reddit" />
<ImageView
android:id="#+id/postcardImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="50dp"
android:visibility="gone" />
</FrameLayout>
<FrameLayout
android:id="#+id/target_layout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".5">
<ImageView
android:id="#+id/attractionImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/attraction"
android:layout_marginBottom="50dp" />
<Button
android:id="#+id/resetButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="reset"
android:layout_gravity="bottom|left"/>
<Button
android:id="#+id/doneButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="done"
android:layout_gravity="bottom|right"/>
</FrameLayout>
</LinearLayout>
And here is the Java code:
public class LobbyActivity extends AppCompatActivity {
private static final String TAG = "LobbyActivity";
#BindView(R.id.flatStanleyImage)
protected ImageView flatStanleyImageView;
#BindView(R.id.postcardImage)
protected ImageView postcardImageView;
#BindView(R.id.target_layout)
protected FrameLayout targetLayout;
#BindView(R.id.source_layout)
protected FrameLayout sourceLayout;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_lobby);
ButterKnife.bind(this);
View.OnLongClickListener longClickListener = new View.OnLongClickListener() {
#Override
public boolean onLongClick(View v) {
ClipData clipData = ClipData.newPlainText("", "");
View.DragShadowBuilder shadowBuilder = new View.DragShadowBuilder(v);
v.startDrag(clipData, shadowBuilder, v, 0);
v.setVisibility(View.INVISIBLE); // we are dragging the shadow
return true;
}
};
flatStanleyImageView.setOnLongClickListener(longClickListener);
View.OnDragListener dragListener = new View.OnDragListener() {
#Override
public boolean onDrag(View v, DragEvent event) {
switch(event.getAction())
{
case DragEvent.ACTION_DRAG_STARTED:
Log.d(TAG, "Action is DragEvent.ACTION_DRAG_STARTED");
case DragEvent.ACTION_DRAG_ENTERED:
Log.d(TAG, "Action is DragEvent.ACTION_DRAG_ENTERED");
case DragEvent.ACTION_DRAG_EXITED:
Log.d(TAG, "Action is DragEvent.ACTION_DRAG_EXITED");
case DragEvent.ACTION_DRAG_LOCATION:
Log.d(TAG, "Action is DragEvent.ACTION_DRAG_LOCATION");
case DragEvent.ACTION_DRAG_ENDED:
Log.d(TAG, "Action is DragEvent.ACTION_DRAG_ENDED. DragEvent.getResult() " + event.getResult());
if (!event.getResult()) {
Log.d(TAG, "Drag was not successful.");
flatStanleyImageView.setVisibility(View.VISIBLE);
}
return true;
case DragEvent.ACTION_DROP:
Log.d(TAG, "Action is DragEvent.ACTION_DROP");
FrameLayout draggedImageParentViewLayout = (FrameLayout) flatStanleyImageView.getParent();
Log.d(TAG, "draggedImageParentViewLayout: " + draggedImageParentViewLayout.getId());
Log.d(TAG, "targetLayout: " + targetLayout.getId());
View view = (View) event.getLocalState();
float x = event.getX();
float y = event.getY();
view.setX(x-(view.getWidth()/2));
view.setY(y-(view.getWidth()/2));
if (draggedImageParentViewLayout != targetLayout) {
draggedImageParentViewLayout.removeView(flatStanleyImageView);
targetLayout.addView(flatStanleyImageView);
}
sourceLayout.invalidate();
targetLayout.invalidate();
return true;
default:
break;
}
return false;
}
};
targetLayout.setOnDragListener(dragListener);
}
#OnClick(R.id.resetButton)
protected void handleResetButtonClick() {
Log.d(TAG, "Begin handleResetButtonClick");
Intent intent = getIntent();
finish();
startActivity(intent);
Log.d(TAG, "End handleResetButtonClick");
}
#OnClick(R.id.doneButton)
protected void handleDoneButtonClick() {
Log.d(TAG, "Begin handleDoneButtonClick");
Bitmap attractionBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.attraction);
Bitmap flatStanleyBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.reddit);
Bitmap bitmapOverlay = Bitmap.createBitmap(attractionBitmap.getWidth(), attractionBitmap.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmapOverlay);
canvas.drawBitmap(attractionBitmap, new Matrix(), null);
canvas.drawBitmap(flatStanleyBitmap, new Matrix(), null);
postcardImageView.setImageBitmap(bitmapOverlay);
postcardImageView.setVisibility(View.VISIBLE);
Log.d(TAG, "End handleDoneButtonClick");
}
}

Related

Check if dragable's object and drop's zone tags are equal

I am making a puzzle game.
I randomly select an image from an array and split it in 4 parts.
My Layout consists of 3 TableRows.
The first row is a LinearLayout with 2 rows as well. This layout has the randomly selected image as a background with a transparency of 0.3
The second and third row are simply for the 4 parts of the split image.
So, i think my question and my description so far has made my problem clear already.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_above="#+id/adView"
android:weightSum="1">
<TableRow
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginBottom="7dp"
android:layout_weight=".5">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="#+id/puzzleBackground"
android:weightSum="1">
<TableRow
android:layout_width="match_parent"
android:layout_height="0dp"
android:weightSum="1"
android:layout_weight=".5">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".5"
android:id="#+id/piece1"
android:tag="piece1"
/>
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".5"
android:id="#+id/piece2"
android:tag="piece2"
/>
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="0dp"
android:weightSum="1"
android:layout_weight=".5">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".5"
android:id="#+id/piece3"
android:tag="piece3"
/>
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".5"
android:id="#+id/piece4"
android:tag="piece4"
/>
</TableRow>
</LinearLayout>
</TableRow>
<TableRow
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginBottom="2dp"
android:layout_weight=".25"
android:weightSum="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="2dp"
android:layout_weight=".5"
android:id="#+id/part1" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="2dp"
android:layout_weight=".5"
android:id="#+id/part2" />
</TableRow>
<TableRow
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight=".25"
android:weightSum="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="2dp"
android:layout_weight=".5"
android:id="#+id/part3" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="2dp"
android:layout_weight=".5"
android:id="#+id/part4" />
</TableRow>
</LinearLayout>
public class Puzzle extends AppCompatActivity {
private String[] puzzleIMGS;
private String randomPuzzleIMG;
private ImageView part1, part2, part3, part4;
private TextView piece1, piece2, piece3, piece4;
private LinearLayout puzzleBackground;
private Bitmap bm1, bm2, bm3, bm4;
private List<Bitmap> parts = new ArrayList<>();
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_puzzle);
//Select random image
puzzleIMGS = getResources().getStringArray(R.array.all_animal_imgs);
randomPuzzleIMG = puzzleIMGS[new Random().nextInt(puzzleIMGS.length)];
//Get the elements
part1 = (ImageView) findViewById(R.id.part1);
part2 = (ImageView) findViewById(R.id.part2);
part3 = (ImageView) findViewById(R.id.part3);
part4 = (ImageView) findViewById(R.id.part4);
piece1 = (TextView) findViewById(R.id.piece1);
piece2 = (TextView) findViewById(R.id.piece2);
piece3 = (TextView) findViewById(R.id.piece3);
piece4 = (TextView) findViewById(R.id.piece4);
part1.setOnTouchListener(new MyTouchListener());
part2.setOnTouchListener(new MyTouchListener());
part3.setOnTouchListener(new MyTouchListener());
part4.setOnTouchListener(new MyTouchListener());
piece1.setOnDragListener(new MyDragListener());
piece2.setOnDragListener(new MyDragListener());
piece3.setOnDragListener(new MyDragListener());
piece4.setOnDragListener(new MyDragListener());
//Convert randomly selected resource image to bitmap
Bitmap originalBm = BitmapFactory.decodeResource(getResources(), getImageId(this, randomPuzzleIMG));
//Split bitmap to 4 parts
bm1 = Bitmap.createBitmap(originalBm, 0, 0, (originalBm.getWidth() / 2), (originalBm.getHeight() / 2));
bm2 = Bitmap.createBitmap(originalBm, (originalBm.getWidth() / 2), 0, (originalBm.getWidth() / 2), (originalBm.getHeight() / 2));
bm3 = Bitmap.createBitmap(originalBm, 0, (originalBm.getHeight() / 2), (originalBm.getWidth() / 2), (originalBm.getHeight() / 2));
bm4 = Bitmap.createBitmap(originalBm, (originalBm.getWidth() / 2), (originalBm.getHeight() / 2), (originalBm.getWidth() / 2), (originalBm.getHeight() / 2));
//Make the background transparent
piece1.setBackgroundDrawable(new BitmapDrawable(getResources(), bm1));
piece1.setAlpha(0.3f);
piece2.setBackgroundDrawable(new BitmapDrawable(getResources(), bm2));
piece2.setAlpha(0.3f);
piece3.setBackgroundDrawable(new BitmapDrawable(getResources(), bm3));
piece3.setAlpha(0.3f);
piece4.setBackgroundDrawable(new BitmapDrawable(getResources(), bm4));
piece4.setAlpha(0.3f);
//Place parts in an array
parts.add(bm1);
parts.add(bm2);
parts.add(bm3);
parts.add(bm4);
//Shuffle the array
Collections.shuffle(parts);
//Assign the correct piece tag to each part
for(int i=0;i<4;i++){
if(i==1) {
part1.setImageBitmap(parts.get(i));
if (parts.get(i).equals(bm1)){
part1.setTag("piece1");
} else if (parts.get(i).equals(bm2)){
part1.setTag("piece2");
} else if (parts.get(i).equals(bm3)){
part1.setTag("piece3");
} else {
part1.setTag("piece4");
}
} else if(i==2){
part2.setImageBitmap(parts.get(i));
if (parts.get(i).equals(bm1)){
part2.setTag("piece1");
} else if (parts.get(i).equals(bm2)){
part2.setTag("piece2");
} else if (parts.get(i).equals(bm3)){
part2.setTag("piece3");
} else {
part2.setTag("piece4");
}
} else if(i==3){
part3.setImageBitmap(parts.get(i));
if (parts.get(i).equals(bm1)){
part3.setTag("piece1");
} else if (parts.get(i).equals(bm2)){
part3.setTag("piece2");
} else if (parts.get(i).equals(bm3)){
part3.setTag("piece3");
} else {
part3.setTag("piece4");
}
} else {
part4.setImageBitmap(parts.get(i));
if (parts.get(i).equals(bm1)){
part4.setTag("piece1");
} else if (parts.get(i).equals(bm2)){
part4.setTag("piece2");
} else if (parts.get(i).equals(bm3)){
part4.setTag("piece3");
} else {
part4.setTag("piece4");
}
}
}
}
private static int getImageId(Context context, String imageName) {
return context.getResources().getIdentifier("drawable/" + imageName, null, context.getPackageName());
}
private final class MyTouchListener implements View.OnTouchListener {
public boolean onTouch(View view, MotionEvent motionEvent) {
if (motionEvent.getAction() == MotionEvent.ACTION_DOWN) {
ClipData data = ClipData.newPlainText("", "");
View.DragShadowBuilder shadowBuilder = new View.DragShadowBuilder(view);
view.startDrag(data, shadowBuilder, view, 0);
return true;
} else {
return false;
}
}
}
class MyDragListener implements View.OnDragListener {
#Override
public boolean onDrag(View v, DragEvent event) {
int action = event.getAction();
switch (action) {
case DragEvent.ACTION_DRAG_STARTED:
// do nothing
break;
case DragEvent.ACTION_DRAG_ENTERED:
break;
case DragEvent.ACTION_DRAG_EXITED:
break;
case DragEvent.ACTION_DROP:
// Dropped, reassign View to ViewGroup
View view = (View) event.getLocalState();
if(view.getTag().equals("piece1")){
ViewGroup owner = (ViewGroup) view.getParent();
owner.removeView(view);
piece1.setBackgroundDrawable(new BitmapDrawable(getResources(), bm1));
piece1.setAlpha(0.9f);
} else if (view.getTag().equals("piece2")){
ViewGroup owner = (ViewGroup) view.getParent();
owner.removeView(view);
piece2.setBackgroundDrawable(new BitmapDrawable(getResources(), bm2));
piece2.setAlpha(0.9f);
} else if (view.getTag().equals("piece3")){
ViewGroup owner = (ViewGroup) view.getParent();
owner.removeView(view);
piece3.setBackgroundDrawable(new BitmapDrawable(getResources(), bm3));
piece3.setAlpha(0.9f);
} else if (view.getTag().equals("piece4")){
ViewGroup owner = (ViewGroup) view.getParent();
owner.removeView(view);
piece4.setBackgroundDrawable(new BitmapDrawable(getResources(), bm4));
piece4.setAlpha(0.9f);
}
break;
case DragEvent.ACTION_DRAG_ENDED:
break;
default:
break;
}
return true;
}
}
}
So, my code they way it is right now, automatically places the dropped part on the correct place. For example, if i drag the first part from the screenshot i am showing above and drop it anywhere in the picture above, it will automatically go in the correct position and that's it. The same thing happens with all the parts.
What i want to do is, if i drop the part with the tag "piece1" above the textview with the tag "piece4" i want it to reject the drop and simply not place the part on the correct place automatically and not .removeView(view);
I am pretty sure this has to be implemented in the case DragEvent.ACTION_DROP: and i think i have to modify my if statement from
if(view.getTag().equals("piece1")){
to something like
if(view.getTag().equals(dropZone.getTag())){
Any help would be highly appreciated as i am pulling my hair over here.
Thank you all in advance.
Oh, i just solved it.
The only thing i had to do was simply nest my if statement of the DragEvent.ACTION_DROP inside another if statement like this
if(view.getTag().equals(v.getTag())){
if(view.getTag().equals("piece1")){
owner.removeView(view);
piece1.setBackgroundDrawable(new BitmapDrawable(getResources(), bm1));
piece1.setAlpha(0.9f);
} else if (view.getTag().equals("piece2")){
owner.removeView(view);
piece2.setBackgroundDrawable(new BitmapDrawable(getResources(), bm2));
piece2.setAlpha(0.9f);
} else if (view.getTag().equals("piece3")){
owner.removeView(view);
piece3.setBackgroundDrawable(new BitmapDrawable(getResources(), bm3));
piece3.setAlpha(0.9f);
} else if (view.getTag().equals("piece4")) {
owner.removeView(view);
piece4.setBackgroundDrawable(new BitmapDrawable(getResources(), bm4));
piece4.setAlpha(0.9f);
}
}

Drag and drop an ImageView onto a another ImageView

I'm developing an android app where the user can drag an ImageView to another ImageView. The ImageView needs to be changed in to dragged ImageView if it meets a certain condition and if it doesnt it should snap back to where it was.I tried doing it but i can't get it to work.
code behind the xml file
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="2"
android:columnWidth="320dp"
android:orientation="vertical"
android:rowCount="14"
android:stretchMode="columnWidth" >
<LinearLayout
android:id="#+id/topleft"
android:layout_width="match_parent"
android:layout_height="413dp"
android:layout_row="0"
android:background="#drawable/shape" >
<ImageView
android:id="#+id/test_house"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/test_house" />
</LinearLayout>
<LinearLayout
android:id="#+id/topright"
android:layout_width="match_parent"
android:layout_height="106dp"
android:background="#drawable/shape"
android:layout_row="13"
android:layout_column="0"
android:weightSum="1">
<ImageView
android:id="#+id/house"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="#drawable/house"
android:layout_weight="0.26" />
<ImageView
android:id="#+id/face"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="#drawable/face"
android:layout_weight="0.24" />
<ImageView
android:id="#+id/duck"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="#drawable/duck"
android:layout_weight="0.24" />
</LinearLayout>
</GridLayout>
code behind java file
public class cs_game_one extends Activity {
boolean state;
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_cs_game_one);
findViewById(R.id.test_house).setOnTouchListener(new MyTouchListener());
findViewById(R.id.house).setOnTouchListener(new MyTouchListener());
findViewById(R.id.face).setOnTouchListener(new MyTouchListener());
findViewById(R.id.duck).setOnTouchListener(new MyTouchListener());
findViewById(R.id.topleft).setOnDragListener(new MyDragListener());
findViewById(R.id.topright).setOnDragListener(new MyDragListener());
}
private final class MyTouchListener implements OnTouchListener {
public boolean onTouch(View view, MotionEvent motionEvent) {
if (motionEvent.getAction() == MotionEvent.ACTION_DOWN) {
ClipData data = ClipData.newPlainText("", "");
DragShadowBuilder shadowBuilder = new View.DragShadowBuilder(view);
view.startDrag(data, shadowBuilder, view, 0);
view.setVisibility(View.INVISIBLE);
return true;
} else {
return false;
}
}
}
class MyDragListener implements OnDragListener {
#Override
public boolean onDrag(View v, DragEvent e) {
if (e.getAction() == DragEvent.ACTION_DROP) {
View view = (View) e.getLocalState();
if (view.getId() == R.id.house && v.getId() == R.id.test_house){
ViewGroup from = (ViewGroup) view.getParent();
from.removeView(view);
v.setBackgroundResource(R.drawable.house);
state = true;
} else {
state = false;
}
}
return state;
}
}
}
After v.setBackgroundResource(R.drawable.house); add this:
v.invalidate();
This tells your UI thread that it needs to redraw that view that you are trying to set to the house Drawable.
In your else statement, change to this:
state = false;
view.setVisibility(View.VISIBLE); //This will make it look like your dragged image snaps back to it's original spot.
The interesting thing about drag and drop in Android is that when you start the drag, it's just hiding the image you originally touched (view in your code) when the drag started. The image you see moving around the screen under your finger is actually the drag shadow. Thus by changing the visibility of view in your else statement, it looks like the image snaps back to where you started the drag.

Android Ontouchlistener not showing correct id of the imageview when it's clicked

I have a fragment containing 6 imageviews in its layout of my android application. When I click on the images, It should toast me the id of the imageview. But instead it is toasting as false, when I click on any of the imageviews. My images are of triangular in shape and to check whether I have clicked inside or not of the image, I have used on touch listener in my project. But it is not showing me the id of the imageview when I click on it. I'm using a navigation drawer in my project and so I'm using here fragments instead of activity. Here is my code:
HomeFragment.java (Edited)
public class HomeFragment extends Fragment {
public HomeFragment(){}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
final View rootView = inflater.inflate(R.layout.fragment_home, container, false);
final OnTouchListener changeColorListener = new OnTouchListener() {
#Override
public boolean onTouch(final View v, MotionEvent event) {
Bitmap bmp = Bitmap.createBitmap(v.getDrawingCache());
int color = 0;
try {
color = bmp.getPixel((int) event.getX(), (int) event.getY());
} catch (Exception e) {
}
if (color == Color.TRANSPARENT)
return false;
else {
//edited part
if(v.getId() == R.id.loginbutton){
Toast.makeText(getActivity(), "Login button", Toast.LENGTH_SHORT).show();
}
//edited part
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
Toast.makeText(getActivity(), v.getId(), Toast.LENGTH_SHORT).show();
break;
case MotionEvent.ACTION_OUTSIDE:
break;
case MotionEvent.ACTION_CANCEL:
break;
case MotionEvent.ACTION_MOVE:
break;
case MotionEvent.ACTION_SCROLL:
break;
case MotionEvent.ACTION_UP:
break;
default:
break;
}
return true;
}
}
};
ImageView loginbutton=(ImageView)rootView.findViewById(R.id.loginbutton);
loginbutton.setDrawingCacheEnabled(true);
loginbutton.setOnTouchListener(changeColorListener);
ImageView flightbutton=(ImageView)rootView.findViewById(R.id.flightbutton);
flightbutton.setDrawingCacheEnabled(true);
flightbutton.setOnTouchListener(changeColorListener);
ImageView registerbutton=(ImageView)rootView.findViewById(R.id.hotelbutton);
registerbutton.setDrawingCacheEnabled(true);
registerbutton.setOnTouchListener(changeColorListener);
ImageView supportbutton=(ImageView)rootView.findViewById(R.id.supportbutton);
supportbutton.setDrawingCacheEnabled(true);
supportbutton.setOnTouchListener(changeColorListener);
ImageView aboutusbutton=(ImageView)rootView.findViewById(R.id.aboutusbutton);
aboutusbutton.setDrawingCacheEnabled(true);
aboutusbutton.setOnTouchListener(changeColorListener);
ImageView contactbutton=(ImageView)rootView.findViewById(R.id.contactbutton);
contactbutton.setDrawingCacheEnabled(true);
contactbutton.setOnTouchListener(changeColorListener);
return rootView;
}
}
fragment_home.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+id/supportbutton"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="31dp"
android:background="#drawable/support" />
<ImageView
android:id="#+id/flightbutton"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_above="#+id/supportbutton"
android:layout_alignLeft="#+id/supportbutton"
android:layout_marginBottom="17dp"
android:background="#drawable/flight3" />
<ImageView
android:id="#+id/hotelbutton"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignBaseline="#+id/flightbutton"
android:layout_alignBottom="#+id/flightbutton"
android:layout_centerHorizontal="true"
android:background="#drawable/hotel2" />
<ImageView
android:id="#+id/aboutusbutton"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignLeft="#+id/hotelbutton"
android:layout_below="#+id/flightbutton"
android:background="#drawable/aboutus" />
<ImageView
android:id="#+id/loginbutton"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignBaseline="#+id/hotelbutton"
android:layout_alignBottom="#+id/hotelbutton"
android:layout_alignParentRight="true"
android:layout_marginRight="37dp"
android:background="#drawable/login" />
<ImageView
android:id="#+id/contactbutton"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignLeft="#+id/loginbutton"
android:layout_centerVertical="true"
android:background="#drawable/contact"
android:fitsSystemWindows="false" />
</RelativeLayout>
Please correct me if I'm wrong.
Edit:
Actually my intention was to check which button was clicked actually. The problem is when I added the edited part and run the app, It's intersting that when I click on the contact image, actually the toast is showing as Login button. But I have given in the else condition with the id of the login imageview, so that when I click on the login image, it should trigger the toast. Instead on clicking the contact image, the toast for login is actually called. How is that possible? Is there any solution for it...
From the documentation of Toast.makeText() there are two makeText() methods:
public static Toast makeText (Context context, int resId, int duration)
public static Toast makeText (Context context, CharSequence text, int duration)
I assume you want to display the ID as a string, but in this case you are passing v.getId() which returns an int, so actually the first method is called, which looks for a resource. So in the first place you could make it
Toast.makeText(getActivity(), v.getId() + "", Toast.LENGTH_SHORT).show()
which will turn your second argument into a string.

how to make layouts transparent on click

I have two layouts and one imageView. The parent layout linearLayout1 have image background and its child layout relativeLayout1 have dark background. So when i move imageView on screen it display a selective area of linearLayout1 image . I applied touch motion but no idea how to display selective area. the code is here
public class MainActivity extends Activity {
// RelativeLayout viewRelative;
ImageButton imgBtnTarget;
Animation aniRotate, aniZoom;
PointF downPoint = new PointF();// Record Mouse Position When Pressed Down
PointF strtPointImg = new PointF(); // Record Start Position of 'img'
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imgBtnTarget = (ImageButton) findViewById(R.id.imageButtontTarget);
imgBtnTarget.setOnTouchListener( new OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
// for moving image
switch (event.getAction()) {
case MotionEvent.ACTION_MOVE:
PointF mv = new PointF(event.getX() - downPoint.x, event
.getY() - downPoint.y);
imgBtnTarget.setX((int) (strtPointImg.x + mv.x));
imgBtnTarget.setY((int) (strtPointImg.y + mv.y));
strtPointImg = new PointF(imgBtnTarget.getX(), imgBtnTarget.getY());
break;
}
return false;
}
});
}
}
and here is xml resource
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/back" >
<RelativeLayout
android:id="#+id/relativeViewBlack"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/black" >
<ImageButton
android:id="#+id/imageButtontTarget"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#android:color/transparent"
android:scaleType="fitCenter"
android:src="#drawable/target" />
</RelativeLayout>
In Java code:
LinearLayout ll = (LinearLayout) findViewById(R.id.your_ll_id);
ll.setAlpha(TRANSPARENT_VALUE);
Or:
ll.setBackgroundColor(Color.TRANSPARENT);
If you want transparent all from the begining add to your Layout in XML:
android:background="#00ffffff"
EDIT:
#Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
v.setAlpha(0.5f);
break;
case MotionEvent.ACTION_UP:
v.setAlpha(1.0f);
break;
case MotionEvent.ACTION_MOVE:
//your code...
break;
}
return true;
}

Unable to draw line over gridview elements properly through textview cells in Android

I would like to implement Word Search app. As part of implementation i have come across canvas and drawing line over grid view cells( letters that form the word) to indicate that user is touching finger over letters to form the word.
I have succeeded partially as of now i can draw a line over letters of grid view but the line is not through center of views of grid View.
Please can anyone assist me with your valuable suggestions .
Have a glance on below screen shot to get a clear idea.
Edited: I'm posting code to get an idea of how I'm implementing it.
xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/root"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#fff" >
<RelativeLayout
android:id="#+id/topbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#A9E2F3" >
<LinearLayout
android:id="#+id/topbar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#336699"
android:orientation="horizontal" >
<Button
android:id="#+id/btn_pause"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pause" />
<Chronometer
android:id="#+id/chronometer1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Chronometer" />
<TextView
android:id="#+id/counter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:textSize="20sp"
android:typeface="serif" />
</LinearLayout>
</RelativeLayout>
<FrameLayout
android:id="#+id/gridFrame"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/wTable"
android:layout_below="#+id/textdisplay" >
<GridView
android:id="#+id/grid"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#E7E8E9"
android:fitsSystemWindows="true"
android:gravity="center"
android:horizontalSpacing="10sp"
android:numColumns="10"
android:padding="1dp"
android:stretchMode="columnWidth"
android:verticalSpacing="10sp" >
</GridView>
</FrameLayout>
<GridView
android:id="#+id/wTable"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#fff"
android:numColumns="3"
android:orientation="vertical" />
</RelativeLayout>
The paint is drawing over frame layout which contains grid view. Grid view elements are printed through custom text view file.
To draw a line i have used LineView.java
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.Log;
import android.view.View;
public class LineView extends View {
public static final float LINE_WIDTH = 30.0f;
public Paint paint = new Paint();
protected Context context;
public float startingX, startingY, endingX, endingY;
public LineView(Context context) {
super(context);
this.context = context;
paint.setColor(Color.parseColor("#2E9AFE"));
paint.setStrokeWidth(LINE_WIDTH);
paint.setStrokeJoin(Paint.Join.ROUND);
paint.setStrokeCap(Paint.Cap.ROUND);
paint.setDither(true);
paint.setAntiAlias(true);
paint.setStyle(Paint.Style.FILL);
paint.setAlpha(90);
}
public void setPoints(float startX, float startY, float endX, float endY) {
startingX = startX;
startingY = startY;
endingX = endX;
endingY = endY;
invalidate();
}
#Override
public void onDraw(Canvas canvas) {
Log.e("LINEVIEW", "startingX" + startingX + " startingY:" + startingY);
Log.e("LINEVIEW", "endingX" + endingX + " endingY:" + endingY);
// canvas.drawLine(startingX, startingY, endingX, endingY, paint);
canvas.drawLine(startingX, startingY, endingX, endingY, paint);
}
}
Main Activity where logic is implemented:
Written only the required logic here.
newGrid = (GridView) findViewById(R.id.grid);
newGrid.setAdapter(new FormTheGridLetters());
newGrid.setOnTouchListener(new OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
// if (mp.isPlaying()) {
// mp.stop();
// }
int action = event.getActionMasked();
switch (action) {
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_MOVE:
case MotionEvent.ACTION_UP:
// data
PaintViewHolder newPaint = new PaintViewHolder();
newPaint.DrawLine = new LineView(WordSearchActivity.this);
gridFrame.addView(newPaint.DrawLine);
buildWord = new StringBuilder();
int x = (int) event.getX();
int y = (int) event.getY();
// test = new LineView(WordSearchActivity.this);
int position = newGrid.pointToPosition(x, y);
Point one,
two;
if (position != GridView.INVALID_POSITION) {
v.getParent().requestDisallowInterceptTouchEvent(true);
cellView = (TextView) newGrid.getChildAt(position);
String a = cellView.getText().toString();
// Log.v(">>>>><<<<<<<????????", a.toString());
switch (action) {
case MotionEvent.ACTION_DOWN:
startX = event.getX();
startY = event.getY();
break;
case MotionEvent.ACTION_MOVE:
break;
case MotionEvent.ACTION_UP:
// Checking the list for formed word ;
//if found that is painted
for (int i1 = 0; i1 < Ans.size(); i1++)
{
if (formedWord.equals(Ans.get(i1)))
{
answerAdapter.notifyDataSetChanged();
newPaint.DrawLine.setPoints(startX, startY, x, y);
// Painted the letters by passing starting and ending points
}
}
break;
}
} else {
if (mSelecting) {
mSelecting = false;
}
}
break;
case MotionEvent.ACTION_CANCEL:
mSelecting = false;
break;
}
return true;
}
});
I don't know if you fix the issue but I will answer anyway for the people that may have these kind of problems. After you recieve the valid position, you can get the center of the view and you can set these values as beginning of the draw.
Like this:
if (position != GridView.INVALID_POSITION) {
MyList.add(position);
v.getParent().requestDisallowInterceptTouchEvent(true);
TextView cellView = (TextView) gridView.getChildAt(position);
centreX = cellView.getX() + cellView.getWidth() / 2;
centreY = cellView.getY() + cellView.getHeight() / 2;
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
newPaint.DrawLine.touch_start(x, y,centreX,centreY);
I have tried this code and it is working. I don't think that you need anymore but I have joined this site recently so maybe it will help other people. I can post more code if you want but
newPaint.DrawLine.touch_start(x, y,centreX,centreY);
is the trick for that issue.
Hope this helps.

Categories

Resources