As a example,have to draw a layout of images.
I inflated an ImageView into a layout. When I swipe on the screen I need to change the color of the each circle to green. How should I do it. I tried with gesture detector, but I can't get what I need.
and this is my code.. I create this view by inflating an image view..
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
getWindow().addFlags(1024);
setContentView(R.layout.test);
DisplayMetrics displaymetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
height = displaymetrics.heightPixels;
width = displaymetrics.widthPixels;
count = width/30;
totalCircles = count * (height/30);
horizontalSpace = width%30;
verticalSpace = height%30;
mRelativeLayout = (RelativeLayout)findViewById(R.id.fl);
mRelativeLayout.setPadding(horizontalSpace/2, verticalSpace/2, horizontalSpace/2, verticalSpace/2);
for(int i=1;i<totalCircles+1;i++){
myButton = new ImageView(this);
myButton.setId(i);
myButton.setImageResource(R.drawable.circle_grey);
LayoutParams lp = new LayoutParams(0,0);
if(i%count != 1){
lp.addRule(RelativeLayout.RIGHT_OF, imgViews.get(i-2).getId());
if(imView != null){
lp.addRule(RelativeLayout.BELOW, imView.getId());
}
if(i%count == 0){
imView = myButton;
}
}else{
if(imView != null){
lp.addRule(RelativeLayout.BELOW, imView.getId());
}
}
mRelativeLayout.addView(myButton,lp);
myButton.getLayoutParams().width = 30;
myButton.getLayoutParams().height = 30;
imgViews.add(myButton);
myButton.setOnTouchListener(new OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
if(event.getAction() == MotionEvent.ACTION_DOWN){
System.out.println("Inside touch listener");
ImageView imV = (ImageView)v;
imV.setImageResource(R.drawable.circle_green);
}
return false;
}
});
}
}
Jack K Fouani's answer is partially correct. Instead of imagView.onTouch you need to use gridview.onTouch.
Please check this sample.
gv.setOnTouchListener(new OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
float currentXPosition = event.getX();
float currentYPosition = event.getY();
int position = gv.pointToPosition((int)currentXPosition, (int) currentYPosition);
//using the position obtained you can change the imageview color.
}
return true;
}
});
Instead of inflating one ImageView. You should fill a GridView where every GridCell contains a circle image. Now
set the OnTouchEvent of those Gridcells to change the ImageView within the GridCell.
my advice is to use GrideView with adapter , inside the adapter you will have position for each imagView the position allow you to check if image is touched or not depending on that you can change ImageView color to white or green
Related
Here is the problem I am facing. On a empty relative layout, when touched textview is instantiated at the touched x y position. I got this far correct, but the problem is that when I touch on the empty space near already instantiated view, previous view and currently placed views are overlapped. I tried by the getting the child views of the layout and checking the current view and already placed view using rect data that if they intersect. How to solve this problem?
Here is the code:
public class MainActivity extends AppCompatActivity
{
private int id = 0;
private RelativeLayout root;
private RelativeLayout.LayoutParams params;
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_designer);
root = (RelativeLayout) findViewById(R.id.rootlayout);
root.setOnTouchListener(new View.OnTouchListener()
{
#Override
public boolean onTouch(View v, MotionEvent event)
{
switch(event.getAction())
{
case MotionEvent.ACTION_DOWN:
instantiateView(v, event);
break;
}
return true;
}
});
}
private void instantiateView(View v, MotionEvent event)
{
int x = (int) event.getX();
int y = (int) event.getY();
TextView bt = new TextView(DesignerActivity.this);
bt.setText("1");
bt.setId(++id);
bt.setBackgroundColor(Color.BLACK);
bt.setTextColor(Color.WHITE);
bt.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View arg0) {
showDialog();
}
});
params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
params.setMargins(x, y, 0, 0);
bt.setLayoutParams(params);
//((ViewGroup) v).addView(bt);
if(root.getChildCount() <= 0)
{
((ViewGroup) v).addView(bt);
}
else
{
for (int i = 0; i < root.getChildCount(); i++)
{
if (!checkCollision(bt, root.getChildAt(i)))
{
if(bt != root.getChildAt(i))
{
((ViewGroup) v).addView(bt);
}
}
}
}
}
private void showDialog()
{
final Dialog dialog = new Dialog(this);
dialog.setContentView(R.layout.dialog_layout);
Button editBtn = (Button) dialog.findViewById(R.id.button1);
Button deleteBtn = (Button) dialog.findViewById(R.id.button2);
editBtn.setOnClickListener(new View.OnClickListener()
{
#Override
public void onClick(View arg0)
{
dialog.dismiss();
}
});
deleteBtn.setOnClickListener(new View.OnClickListener()
{
#Override
public void onClick(View arg0)
{
dialog.dismiss();
}
});
dialog.show();
}
private boolean checkCollision(View v1, View v2)
{
Rect r1 = new Rect(v1.getLeft(), v1.getTop(), v1.getRight(), v1.getBottom());
Rect r2 = new Rect(v2.getLeft(), v2.getTop(), v2.getRight(), v2.getBottom());
return r1.intersect(r2);
}
}
You are using Relative Layout that's why your Textviews are overlapping.
If you don't want the overlapping and want to place it next or somewhere else to the overlapped view , it is your decision. Just check if they intersect and take appropriate decision based on your requirement.
Below line is the problem in your code.
Rect r1 = new Rect(v1.getLeft(), v1.getTop(), v1.getRight(), v1.getBottom());
You set the params' Margin does not mean that you will get desired left,top,right, bottom values.You will get these values right after the inflation of your view hierarchy.
You can use this function:
private boolean checkCollision(View v1, View v2)
{
int leftMargin = ((RelativeLayout.LayoutParams) v1.getLayoutParams()).leftMargin;
int topMargin = ((RelativeLayout.LayoutParams) v1.getLayoutParams()).topMargin;
Rect r1 = new Rect(root.getPaddingLeft() + leftMargin, root.getPaddingTop() + topMargin,
root.getPaddingLeft() + leftMargin + v2.getWidth(), root.getPaddingTop() + topMargin + v2.getHeight());
Rect r2 = new Rect(v2.getLeft(), v2.getTop(), v2.getRight(), v2.getBottom());
return r1.intersect(r2);
}
After that use
params.addRule(); according to your requirement where you want to place your overlapping view.
i found this code in a post that used on touch listener for linear layout.
in linear layout there is some child layout and each one play same sound but with pitch . now how can i use each child to play a different sound .
the other word how can i access to each child?
public class MainActivity extends Activity {
LinearLayout pianoKeysContainer;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
pianoKeysContainer = (LinearLayout) findViewById(R.id.key_container);
pianoKeysContainer.setOnTouchListener(onYourViewTouchListener);
}
//Here we load the view positions after render it and fill the array with the positions
private List<Integer> positionsLeft_whiteKeys = new ArrayList<Integer>();
private List<Integer> positionsRight_whiteKeys = new ArrayList<Integer>();
public void onWindowFocusChanged(boolean hasFocus)
{
super.onWindowFocusChanged(hasFocus);
for (int i = 0; i < pianoKeysContainer.getChildCount(); i++)
{
//positionsLeft_whiteKeys holds the start x of each view.
positionsLeft_whiteKeys.add(pianoKeysContainer.getChildAt(i).getLeft());
//positionsRight_whiteKeys holds the end x of each view.
positionsRight_whiteKeys.add(pianoKeysContainer.getChildAt(i).getRight());
}
}
public View.OnTouchListener onYourViewTouchListener = new View.OnTouchListener()
{
float positionX;
FrameLayout pianoKey;
FrameLayout lastPlayedKey;
ArrayList<FrameLayout> pressedKeys = new ArrayList<FrameLayout>();
#Override
public boolean onTouch(View view, MotionEvent motionEvent)
{
positionX = motionEvent.getX();
float pitch;
//Looping on the child of the layout which contains the piano keys
for (int x = 0; x < ((LinearLayout) view).getChildCount(); x++)
{
// Calculating the pitch to get good chords
pitch = (float) Math.pow(Math.pow(2.0, 1 / 12.0), (float) x);
pianoKey = (FrameLayout) ((LinearLayout) view).getChildAt(x);
if (positionsLeft_whiteKeys.size() >= 0 && positionsRight_whiteKeys.size() >= 0)
{
if (positionX > positionsLeft_whiteKeys.get(x) && positionX < positionsRight_whiteKeys.get(x))
{
pianoKey = (FrameLayout) ((LinearLayout) view).getChildAt(x);
if (pianoKey != null)
{
pianoKey.setBackgroundResource(R.drawable.dinger14);
pressedKeys.add(pianoKey);
}
if (lastPlayedKey != pianoKey)
playKey(pitch);
lastPlayedKey = pianoKey;
break;
}
if (lastPlayedKey != null)
{
pianoKey.setBackgroundResource(R.drawable.dinger14);
lastPlayedKey.setBackgroundResource(R.drawable.dinger14);
}
}
}
if (motionEvent.getAction() == MotionEvent.ACTION_UP)
{
lastPlayedKey = null;
for (FrameLayout pressedKey : pressedKeys)
{
pressedKey.setBackgroundResource(R.drawable.dinger14);
}
}
return false;
}
};
//This is sound play method
SoundPool sp = new SoundPool(1, AudioManager.STREAM_MUSIC, 1);
public void playKey(final float pitch)
{
//here you should store your piano sound at res/raw then load it
sp.load(this, R.raw.chitare3, 1);
sp.setOnLoadCompleteListener(new SoundPool.OnLoadCompleteListener()
{
#Override
public void onLoadComplete(SoundPool soundPool, int i, int i2)
{
soundPool.play(i, 0.99f, 0.99f, 1, 0, pitch);
}
});
}
}
If you have no need of parent on touch event then directly apply this same event on each child...
pianoKeysContainer1 = (LinearLayout) findViewById(R.id.key_child1);
pianoKeysContainer2 = (LinearLayout) findViewById(R.id.key_child2);
pianoKeysContainer1.setOnTouchListener(onYourViewTouchListener);
pianoKeysContainer2.setOnTouchListener(onYourViewTouchListener);
You can apply onYourViewTouchListener onTouchListener on each child as shown above.
Then in View.onTouchListener check which child listener is called by checking view id.
public View.OnTouchListener onYourViewTouchListener = new View.OnTouchListener()
{
float positionX;
FrameLayout pianoKey;
FrameLayout lastPlayedKey;
ArrayList<FrameLayout> pressedKeys = new ArrayList<FrameLayout>();
#Override
public boolean onTouch(View view, MotionEvent motionEvent)
{
// Check **view id** here and apply required action based on this view id.
.............
.............
I have an imageview, and after i add image (a marker) on this imageview.
At the end, i want to create a bitmap, included the new marker.
But if i try to create a bitmap from relative layout, i create an image without new marker! Why?
imageview= (ImageView)findViewById(R.id.image);
//insert a marker on my imageview
final RelativeLayout rr = (RelativeLayout) findViewById(R.id.relative);
rr.setOnTouchListener(new OnTouchListener() {
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN){
int x = (int) event.getX() ;
int y = (int) event.getY();
RelativeLayout.LayoutParams lp =new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);; //Assuming you use a RelativeLayout
ImageView iv=new ImageView(getApplicationContext());
lp.setMargins(x,y,0,0);
iv.setLayoutParams(lp);
iv.setImageDrawable(getResources().getDrawable(R.drawable.marker));
((ViewGroup)v).addView(iv);
//create a bitmap from relative layout but the new bitmap is without marker
Bitmap b1 = Bitmap.createBitmap(rr.getWidth(), rr.getHeight(), Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(b1);
((ViewGroup)v).draw(c);
}
return false;
}
It happens because adding marker dynamically to the layout, to add dynamic views it has some delay. Thats the reason creating bitmap without marker. On second touch with singe marker bitmap will be created. The solution is save bitmap after some delay.
Solution is here:
private Handler handler = new Handler(); //handler object in global
rr.setOnTouchListener(new OnTouchListener() {
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN){
int x = (int) event.getX() ;
int y = (int) event.getY();
RelativeLayout.LayoutParams lp =new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);; //Assuming you use a RelativeLayout
ImageView iv=new ImageView(getApplicationContext());
lp.setMargins(x,y,0,0);
iv.setLayoutParams(lp);
iv.setImageDrawable(getResources().getDrawable(R.drawable.marker));
((ViewGroup)v).addView(iv);
//run handler after 1000 milli seconds i.e 1 sec
handler.postDelayed(runnable, 1000);
}
return false;
}
private Runnable runnable = new Runnable() {
#Override
public void run() {
//wrote your block of code here
//create a bitmap from relative layout but the new bitmap is without marker
Bitmap b1 = Bitmap.createBitmap(rr.getWidth(), rr.getHeight(), Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(b1);
((ViewGroup)v).draw(c);
}
};
Look here How to Save Bitmap as image in SD card
I've just started programming for Android. I've searched for my problem a lot, but the advises didn't help me. I want the same images appear on screen in the touch coordinates. That's what I've done:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
View main_view = (View)findViewById(R.id.main_view);
main_view.setOnTouchListener(new View.OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
ImageView image = new ImageView(getApplicationContext());
//ImageView image = (ImageView)findViewById(R.id.broken);
image.setImageResource(R.drawable.broken);
image.setX(event.getX() + image.getWidth() / 2);
image.setY(event.getY() - image.getHeight() / 2);
LinearLayout top_layout = (LinearLayout) findViewById(R.id.top_layout);
LayoutParams p = new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
image.setLayoutParams(p);
top_layout.addView(image);
return true;
}
});
}
Everything seems right to me, but when touching the screen, nothing happens. Where is the obvious mistake I've made? Thanks in advance.
You can't do that in a LinearLayout.
Let's use a FrameLayout instead.
activity_main.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/framelayout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</FrameLayout>
MainActivity.java
public class MainActivity extends Activity {
private FrameLayout mLayout;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mLayout = (FrameLayout) findViewById(R.id.framelayout);
mLayout.setOnTouchListener(mListener);
}
private OnTouchListener mListener = new OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
return true;
case MotionEvent.ACTION_UP:
// decode the resource to get width and height
Options opts = new Options();
opts.inJustDecodeBounds = true;
BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher, opts);
int imageWidth = opts.outWidth;
int imageHeight = opts.outHeight;
// set the imageview's top and left margins
FrameLayout.LayoutParams lp = new LayoutParams(imageWidth, imageHeight);
lp.leftMargin = (int) (event.getX() - (imageWidth / 2));
lp.topMargin = (int) (event.getY() - (imageHeight / 2));
ImageView image = new ImageView(MainActivity.this);
image.setImageResource(R.drawable.ic_launcher);
mLayout.addView(image, lp);
return false;
}
return false;
}
};
}
setX and setY don't set the images position. It basically scrolls the image in place. The position is controlled by its parent view. Since its parent is a linear layout, it will always be placed below or to the right of the thing above it in the layout. If you want to place it somewhere exactly, you need to put it in a parent that supports that, such as the deprecated AbsoluteLayout.
i use this code for displays two view mRenderSurfaceView and gestureOverlayView:
relativeLayout = new RelativeLayout(this);
final FrameLayout.LayoutParams relativeLayoutLayoutParams = new FrameLayout.LayoutParams(RelativeLayout.LayoutParams.FILL_PARENT , RelativeLayout.LayoutParams.FILL_PARENT );
gestureOverlayView = new GestureOverlayView(this);
gestureOverlayView.setEnabled(true);
this.mRenderSurfaceView = new RenderSurfaceView(this);
this.mRenderSurfaceView.setRenderer(mEngine);
surfaceViewLayoutParams = new RelativeLayout.LayoutParams(super.createSurfaceViewLayoutParams());
gestureOverlayView.addOnGesturePerformedListener(this);
relativeLayout.addView(this.mRenderSurfaceView, surfaceViewLayoutParams);
relativeLayout.addView(gestureOverlayView, 1248,1152);
gestureOverlayView.setVisibility(View.GONE);
this.setContentView(relativeLayout, relativeLayoutLayoutParams);
i drawn with this:
#Override
public boolean onTouch(View v, MotionEvent paramMotionEvent) {
//TODO Auto-generated method stub
if(paramMotionEvent.getAction() == MotionEvent.ACTION_DOWN) {
isDrawing = true;
}
//TouchEvent
if(paramMotionEvent.getAction() == MotionEvent.ACTION_UP) {
isDrawing = false;
rec = new Rectangle[250];
Arrays.fill( rec, null );
irec=0;
}
if (isDrawing = true) {
if (rec[249]!=null){
return false;
}
rec[irec] = new Rectangle(paramMotionEvent.getX(), paramMotionEvent.getY(), 1, 1);
if (irec != 0) {
Line l = new Line(rec[irec-1].getX(), rec[irec-1].getY(), rec[irec].getX(), rec[irec].getY());
l.setColor(0.5f, 1f, 0.3f);
mScene.attachChild(l);
}
irec++;
}
return true;
}
and in OnloadScene i this gestureOverlayView.setOnTouchListener(this);
my Scene do 1248*1152, the problem is public boolean onTouch works fine if i in up left but if move down in scene or right the drawn is shift. how make a view with good Width and height (I guess that is the problem, this keep camera ratio) ?
if i use mScene.setOnSceneTouchListener the drawn is ok but the gesture don't work ...
Solved by velocityOnScreenControl.attachChild(l); of (private AnalogOnScreenControl velocityOnScreenControl;) Use AnalogOnScreenControl example.