design - Connecting 2 images in android -

design - Connecting 2 images in android -

i want connect 2 images in android. example,

i want them this,

i have done hard coding. first find upper left of greenish image , find the lower left point of greenish side.i touch event's event.gerrawx() , event.getrawy() parameters. know distance in x , y between 2 points. similar thing reddish 1 too. when greenish piece moved close reddish calculate if upper left point of reddish piece near lower left of greenish piece. if translate greenish one/ reddish 1 other one. hard coded calculation should fail same size tablet or phone different resolution. want know how generalize solution. thanks.

edit: gameactivity , imageinfo class seek connect both images. have 6 images this. , wanto connect them. image 1 connect image 2 , image 2 3 , on.

gameactivity class

package com.example.jigsawpuzzle; import com.example.test.r; import android.annotation.suppresslint; import android.app.activity; import android.app.alertdialog; import android.app.dialog; import android.content.context; import android.content.dialoginterface; import android.content.intent; import android.content.pm.activityinfo; import android.content.res.configuration; import android.graphics.point; import android.media.audiomanager; import android.media.soundpool; import android.os.bundle; import android.util.displaymetrics; import android.util.log; import android.view.display; import android.view.motionevent; import android.view.surface; import android.view.view; import android.view.view.onclicklistener; import android.view.view.ontouchlistener; import android.view.viewgroup.layoutparams; import android.widget.button; import android.widget.imageview; import android.widget.relativelayout; import android.widget.toast; @suppresslint("newapi") public class gameactivity extends activity implements ontouchlistener { static double screeninches; int touchstartx = 0; int touchstarty = 0; int diffx = 0; int diffy = 0; int attachedpieces=0; int imagex = 0; int imagey = 0; int height,width; boolean [] flag = new boolean[7]; boolean isportait; relativelayout relataivelayoutlayout; relativelayout.layoutparams paramsa,paramsb,paramsc,paramsd,paramse,paramsf; imageview imagea,imageb,imagec,imaged,imagee,imagef; imageinfo [] imageinfoarray = new imageinfo[7]; // added sound effect private soundpool soundpool; private int correctpieceattachsoundid,gamefinishsoundid; private boolean loaded = false; //for 10inch landscape height = 752, width = 1280; portrait height = 1232 width = 800 @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); isportait = (getresources().getconfiguration().orientation == configuration.orientation_landscape) ? false : true; display display = getwindowmanager().getdefaultdisplay(); height = display.getheight(); width = display.getwidth(); imagea = new imageview(this); imageb = new imageview(this); imagec = new imageview(this); imaged = new imageview(this); imagee = new imageview(this); imagef = new imageview(this); displaymetrics dm = new displaymetrics(); getwindowmanager().getdefaultdisplay().getmetrics(dm); double x = math.pow(dm.widthpixels/dm.xdpi,2); double y = math.pow(dm.heightpixels/dm.ydpi,2); screeninches = math.sqrt(x+y); if(screeninches>9.0) { imagea.setbackgroundresource(r.drawable.a); imageb.setbackgroundresource(r.drawable.b); imagec.setbackgroundresource(r.drawable.c); imaged.setbackgroundresource(r.drawable.d); imagee.setbackgroundresource(r.drawable.e); imagef.setbackgroundresource(r.drawable.f); } else { imagea.setbackgroundresource(r.drawable.aa); imageb.setbackgroundresource(r.drawable.bb); imagec.setbackgroundresource(r.drawable.cc); imaged.setbackgroundresource(r.drawable.dd); imagee.setbackgroundresource(r.drawable.ee); imagef.setbackgroundresource(r.drawable.ff); } imagea.setid(1); imagea.settag("a"); paramsa = new relativelayout.layoutparams(layoutparams.wrap_content,layoutparams.wrap_content); //the wrap_content parameters can replaced absolute width , height or fill_parent option) imagea.setlayoutparams(paramsa); imagea.setontouchlistener(this); //log.d("gameactivity", "") imageb.setid(2); imageb.settag("b"); paramsb = new relativelayout.layoutparams(layoutparams.wrap_content,layoutparams.wrap_content); //the wrap_content parameters can replaced absolute width , height or fill_parent option) imageb.setlayoutparams(paramsb); imageb.setontouchlistener(this); imagec.setid(3); imagec.settag("c"); paramsc = new relativelayout.layoutparams(layoutparams.wrap_content,layoutparams.wrap_content); //the wrap_content parameters can replaced absolute width , height or fill_parent option) imagec.setlayoutparams(paramsc); imagec.setontouchlistener(this); imaged.setid(4); imaged.settag("d"); paramsd = new relativelayout.layoutparams(layoutparams.wrap_content,layoutparams.wrap_content); //the wrap_content parameters can replaced absolute width , height or fill_parent option) imaged.setlayoutparams(paramsd); imaged.setontouchlistener(this); imagee.setid(5); imagee.settag("e"); paramse = new relativelayout.layoutparams(layoutparams.wrap_content,layoutparams.wrap_content); //the wrap_content parameters can replaced absolute width , height or fill_parent option) imagee.setlayoutparams(paramse); imagee.setontouchlistener(this); imagef.setid(6); imagef.settag("f"); paramsf = new relativelayout.layoutparams(layoutparams.wrap_content,layoutparams.wrap_content); //the wrap_content parameters can replaced absolute width , height or fill_parent option) imagef.setlayoutparams(paramsf); imagef.setontouchlistener(this); setuppieces(); // set hardware buttons command music this.setvolumecontrolstream(audiomanager.stream_music); // load sound soundpool = new soundpool(10, audiomanager.stream_music, 0); soundpool.setonloadcompletelistener(new soundpool.onloadcompletelistener() { @override public void onloadcomplete(soundpool soundpool, int sampleid, int status) { loaded = true; } }); gamefinishsoundid = soundpool.load(this, r.raw.bells, 1); correctpieceattachsoundid= soundpool.load(this, r.raw.bell, 1); } public void playsound(int soundid) { audiomanager audiomanager = (audiomanager) getsystemservice(audio_service); float actualvolume = (float) audiomanager.getstreamvolume(audiomanager.stream_music); float maxvolume = (float) audiomanager.getstreammaxvolume(audiomanager.stream_music); float volume = actualvolume / maxvolume; // sound loaded already? if (loaded) { soundpool.play(soundid, volume, volume, 1, 0, 1.0f); } } public void onconfigurationchanged(configuration newconfig) { super.onconfigurationchanged(newconfig); // checks orientation of screen if (newconfig.orientation == configuration.orientation_landscape) { // toast.maketext(this, "landscape", toast.length_short).show(); } else if (newconfig.orientation == configuration.orientation_portrait) { // toast.maketext(this, "portrait", toast.length_short).show(); } // toast.maketext(this, "in onconfiguaration changed", toast.length_short).show(); isportait = (getresources().getconfiguration().orientation == configuration.orientation_landscape) ? false : true; ((relativelayout)imagea.getparent()).removeallviews(); log.d("gameactivity", "in onconfigurationchanged"); setuppieces(); } public void setuppieces() { relativelayout relataivelayoutlayout = new relativelayout(this); display display = getwindowmanager().getdefaultdisplay(); height = display.getheight(); width = display.getwidth(); if(!isportait) { paramsa.leftmargin = 10; //your x coordinate paramsa.topmargin = 30; //your y coordinate } else { paramsa.leftmargin = 30; //your x coordinate paramsa.topmargin = 10; //your y coordinate } imagea.setlayoutparams(paramsa); imagea.setontouchlistener(this); //log.d("gameactivity", "") if(!isportait) { paramsb.leftmargin = 650; //your x coordinate paramsb.topmargin = 300; //your y coordinate } else { paramsb.leftmargin = 300; //your x coordinate paramsb.topmargin = 750; //your y coordinate } imageb.setlayoutparams(paramsb); imageb.setontouchlistener(this); if(!isportait) { paramsc.leftmargin = 400; //your x coordinate paramsc.topmargin = 380; //your y coordinate } else { paramsc.leftmargin = 400; //your x coordinate paramsc.topmargin = 350; //your y coordinate } imagec.setlayoutparams(paramsc); imagec.setontouchlistener(this); if(!isportait) { paramsd.leftmargin = 750; //your x coordinate paramsd.topmargin = 20; //your y coordinate } else { paramsd.leftmargin = 20; //your x coordinate paramsd.topmargin = 750; //your y coordinate } imaged.setlayoutparams(paramsd); imaged.setontouchlistener(this); if(!isportait) { paramse.leftmargin = 900; //your x coordinate paramse.topmargin = 400; //your y coordinate } else { paramse.leftmargin = 475; //your x coordinate paramse.topmargin = 700; //your y coordinate } imagee.setlayoutparams(paramse); imagee.setontouchlistener(this); if(!isportait) { paramsf.leftmargin = 90; //your x coordinate paramsf.topmargin = 300; //your y coordinate } else { paramsf.leftmargin = 90; //your x coordinate paramsf.topmargin = 300; //your y coordinate } imagef.setlayoutparams(paramsf); imagef.setontouchlistener(this); imageinfo imageainfo = new imageinfo(imagea.getid(),imagea,1,2); imageinfoarray[0] = imageainfo; imageinfo imagebinfo = new imageinfo(imageb.getid(),imageb,1,3); imageinfoarray[1] = imagebinfo; imageinfo imagecinfo = new imageinfo(imagec.getid(),imagec,2,4); imageinfoarray[2] = imagecinfo; imageinfo imagedinfo = new imageinfo(imaged.getid(),imaged,3,5); imageinfoarray[3] = imagedinfo; imageinfo imageeinfo = new imageinfo(imagee.getid(),imagee,4,6); imageinfoarray[4] = imageeinfo; imageinfo imagefinfo = new imageinfo(imagef.getid(),imagef,5,6); imageinfoarray[5] = imagefinfo; relataivelayoutlayout.addview(imagea); relataivelayoutlayout.addview(imageb); relataivelayoutlayout.addview(imagec); relataivelayoutlayout.addview(imaged); relataivelayoutlayout.addview(imagee); relataivelayoutlayout.addview(imagef); setcontentview(relataivelayoutlayout); } private void updateposition(int id) { if(flag[imageinfoarray[id-1].id]) return; flag[imageinfoarray[id-1].id] = true; relativelayout.layoutparams param = (relativelayout.layoutparams)imageinfoarray[id-1].imageview.getlayoutparams(); param.leftmargin = imageinfoarray[id-1].imageview.getleft() + diffx; param.topmargin = imageinfoarray[id-1].imageview.gettop() + diffy; imageinfoarray[id-1].imageview.setlayoutparams(param); if(imageinfoarray[id-1].istopconnected) updateposition(imageinfoarray[id-1].toppieceid); if(imageinfoarray[id-1].isbottomconnected) updateposition(imageinfoarray[id-1].bottompieceid); return; } @override public boolean ontouch(view v, motionevent event) { if(v instanceof imageview) { imageview imageview = (imageview) v; imageinfo imageinfo = imageinfoarray[imageview.getid()-1]; switch (event.getaction() & motionevent.action_mask) { case motionevent.action_down: touchstartx = (int) event.getrawx(); touchstarty = (int) event.getrawy(); imagex = imageview.getleft(); imagey = imageview.gettop(); //toast.maketext(this, "x = "+event.getrawx()+" y = "+event.getrawy(), toast.length_short).show(); break; case motionevent.action_up: touchstartx = (int) event.getrawx(); touchstarty = (int) event.getrawy(); imagex = imageview.getleft(); imagey = imageview.gettop(); int id = imageinfo.id; while(imageinfo.istopconnected) { if(imageinfo.id == imageinfo.toppieceid) break; imageinfo = imageinfoarray[imageinfo.toppieceid-1]; } if(!imageinfo.istopconnected) { imageview = imageinfo.imageview; int topconnectingpieceid = imageinfo.toppieceid; int topconnectingx=0,topconnectingy=0; topconnectingx = imageinfo.calculatetopx(imageview.getleft(), imageview.getid()); topconnectingy = imageinfo.calculatetopy(imageview.gettop(), imageview.getid()); imageinfo topimageinfo = imageinfoarray[topconnectingpieceid-1]; int bottomconnectingx = topimageinfo.calculatebottomx(topimageinfo.imageview.getleft(),topconnectingpieceid); int bottomconnectingy = topimageinfo.calculatebottomy(topimageinfo.imageview.gettop(),topconnectingpieceid); diffx = (bottomconnectingx-topconnectingx); diffy = (bottomconnectingy-topconnectingy); if(math.abs(diffx)<=20 && math.abs(diffy)<=20) { for(int i=0;i<7;i++) flag[i]=false; updateposition(imageinfo.id); imageinfo.setistopconnected(true); topimageinfo.setisbottomconnected(true); attachedpieces++; if(attachedpieces==5) { setupfinishdialogue(); playsound(gamefinishsoundid); } else playsound(correctpieceattachsoundid); break; } } imageinfo = imageinfoarray[id-1]; while(imageinfo.isbottomconnected) { if(imageinfo.id == imageinfoarray[imageinfo.bottompieceid-1].id) break; imageinfo = imageinfoarray[imageinfo.bottompieceid-1]; } imageview = imageinfo.imageview; if(!imageinfo.isbottomconnected) { int topconnectingx=0,topconnectingy=0; int bottomconnectingx = imageinfo.calculatebottomx(imageview.getleft(), imageview.getid()); int bottomconnectingy = imageinfo.calculatebottomy(imageview.gettop(), imageview.getid()); int bottomconnectingpieceid = imageinfo.bottompieceid; imageinfo bottomimageinfo = imageinfoarray[bottomconnectingpieceid-1]; topconnectingx = bottomimageinfo.calculatetopx(bottomimageinfo.imageview.getleft(),bottomconnectingpieceid); topconnectingy = bottomimageinfo.calculatetopy(bottomimageinfo.imageview.gettop(), bottomconnectingpieceid); diffx = (topconnectingx-bottomconnectingx); diffy = (topconnectingy-bottomconnectingy); if(math.abs(diffx)<=20 && math.abs(diffy)<=20) { for(int i=0;i<7;i++) flag[i]=false; updateposition(imageinfo.id); imageinfo.setisbottomconnected(true); bottomimageinfo.setistopconnected(true); attachedpieces++; if(attachedpieces==5) { setupfinishdialogue(); playsound(gamefinishsoundid); } else playsound(correctpieceattachsoundid); } } break; case motionevent.action_move: diffx = (int) (event.getrawx() - touchstartx); diffy = (int) (event.getrawy() - touchstarty); touchstartx = (int)event.getrawx(); touchstarty = (int)event.getrawy(); for(int i=0;i<7;i++) flag[i]=false; updateposition(imageinfo.id); break; default: break; } } homecoming true; } void lockorientation() { switch (getresources().getconfiguration().orientation) { case configuration.orientation_portrait: if(android.os.build.version.sdk_int < android.os.build.version_codes.froyo) { setrequestedorientation(activityinfo.screen_orientation_portrait); } else { int rotation = getwindowmanager().getdefaultdisplay().getrotation(); if(rotation == android.view.surface.rotation_90|| rotation == android.view.surface.rotation_180) { setrequestedorientation(activityinfo.screen_orientation_reverse_portrait); } else { setrequestedorientation(activityinfo.screen_orientation_portrait); } } break; case configuration.orientation_landscape: if(android.os.build.version.sdk_int < android.os.build.version_codes.froyo) { setrequestedorientation(activityinfo.screen_orientation_landscape); } else { int rotation = getwindowmanager().getdefaultdisplay().getrotation(); if(rotation == android.view.surface.rotation_0 || rotation == android.view.surface.rotation_90){ setrequestedorientation(activityinfo.screen_orientation_landscape); } else { setrequestedorientation(activityinfo.screen_orientation_reverse_landscape); } } break; } } void setupfinishdialogue() { /*if(getwindowmanager().getdefaultdisplay().getrotation()==3) setrequestedorientation(activityinfo.screen_orientation_portrait); else if(getwindowmanager().getdefaultdisplay().getrotation()==1) setrequestedorientation(activityinfo.screen_orientation_reverse_portrait); else if(getwindowmanager().getdefaultdisplay().getrotation()==2) setrequestedorientation(activityinfo.screen_orientation_reverse_landscape); else setrequestedorientation(activityinfo.screen_orientation_landscape); setrequestedorientation(activityinfo.screen_orientation_nosensor);*/ lockorientation(); alertdialog.builder builderforalertbox = new alertdialog.builder(this); builderforalertbox.setcancelable(false).setmessage("good job!").setpositivebutton("restart", dialogclicklistner).setnegativebutton("quit", dialogclicklistner). setcancelable(true).show(); } dialoginterface.onclicklistener dialogclicklistner = new dialoginterface.onclicklistener() { public void onclick(dialoginterface dialog, int which) { setrequestedorientation(activityinfo.screen_orientation_sensor); switch (which) { case dialoginterface.button_positive: finish(); intent intent = new intent(getapplicationcontext(),gameactivity.class); startactivity(intent); break; case dialoginterface.button_negative: finish(); default: break; } } };

}

imageinfo class

package com.example.jigsawpuzzle; import android.widget.imageview; import android.widget.toast; public class imageinfo { imageview imageview; int imageatopleftdifferencex = -1; int imageatopleftdifferencey = -1; int imageabottomrightdifferencex = 113; int imageabottomrightdifferencey = 140; int imagebtopleftdifferencex = 0; int imagebtopleftdifferencey = 0; int imagebbottomrightdifferencex = 0; int imagebbottomrightdifferencey = 111; int imagectopleftdifferencex = 14; int imagectopleftdifferencey = 0; int imagecbottomrightdifferencex = 0; int imagecbottomrightdifferencey = 88; int imagedtopleftdifferencex = 92; int imagedtopleftdifferencey = 2; int imagedbottomrightdifferencex = 0; int imagedbottomrightdifferencey = 70; /*int imageetopleftdifferencex = 0; int imageetopleftdifferencey = 0; int imageebottomrightdifferencex = 55; int imageebottomrightdifferencey = 112;*/ int imageetopleftdifferencex = 55; int imageetopleftdifferencey = 112; int imageebottomrightdifferencex = 0; int imageebottomrightdifferencey = 0; /*int imageftopleftdifferencex = 0; int imageftopleftdifferencey = 26; int imagefbottomrightdifferencex = 0; int imagefbottomrightdifferencey = 109; int id,toppieceid,bottompieceid;*/ int imageftopleftdifferencex = 0; int imageftopleftdifferencey = 109; int imagefbottomrightdifferencex = 0; int imagefbottomrightdifferencey = 26; int id,toppieceid,bottompieceid; boolean istopconnected = false; boolean isbottomconnected = false; public imageinfo(int id,imageview imageview,int toppieceid,int bottompieceid) { this.toppieceid = toppieceid; this.bottompieceid = bottompieceid; this.imageview = imageview; this.id = id; if(id==1) istopconnected = true; else if(id==6) isbottomconnected = true; if(gameactivity.screeninches>9.0) initializepiecesinfo(); } private void initializepiecesinfo() { imageatopleftdifferencex = 0; imageatopleftdifferencey = 0; imageabottomrightdifferencex = 150; imageabottomrightdifferencey = 184; imagebtopleftdifferencex = 0; imagebtopleftdifferencey = 0; imagebbottomrightdifferencex = 0; imagebbottomrightdifferencey = 148; imagectopleftdifferencex = 23; imagectopleftdifferencey = 0; imagecbottomrightdifferencex = 0; imagecbottomrightdifferencey = 115; imagedtopleftdifferencex = 121; imagedtopleftdifferencey = 0; imagedbottomrightdifferencex = 0; imagedbottomrightdifferencey = 91; /*int imageetopleftdifferencex = 0; int imageetopleftdifferencey = 0; int imageebottomrightdifferencex = 55; int imageebottomrightdifferencey = 112;*/ imageetopleftdifferencex = 74; imageetopleftdifferencey = 147; imageebottomrightdifferencex = 0; imageebottomrightdifferencey = 0; /*int imageftopleftdifferencex = 0; int imageftopleftdifferencey = 26; int imagefbottomrightdifferencex = 0; int imagefbottomrightdifferencey = 109; int id,toppieceid,bottompieceid;*/ imageftopleftdifferencex = 0; imageftopleftdifferencey = 144; imagefbottomrightdifferencex = 0; imagefbottomrightdifferencey = 26; } int calculatetopx(int realx,int id) { if(id==2) homecoming realx+imagebtopleftdifferencex; if(id==3) homecoming realx+imagectopleftdifferencex; if(id==4) homecoming realx+imagedtopleftdifferencex; if(id==5) homecoming realx+imageetopleftdifferencex; if(id==6) homecoming realx+imageftopleftdifferencex; homecoming realx; } int calculatetopy(int realy,int id) { if(id==2) homecoming realy+imagebtopleftdifferencey; if(id==3) homecoming realy+imagectopleftdifferencey; if(id==4) homecoming realy+imagedtopleftdifferencey; if(id==5) homecoming realy+imageetopleftdifferencey; if(id==6) homecoming realy+imageftopleftdifferencey; homecoming realy; } int calculatebottomx(int realx,int id) { if(id==1) homecoming realx+imageabottomrightdifferencex; if(id==2) homecoming realx+imagebbottomrightdifferencex; if(id==3) homecoming realx+imagecbottomrightdifferencex; if(id==4) homecoming realx+imagedbottomrightdifferencex; if(id==5) homecoming realx+imageebottomrightdifferencex; homecoming realx+imagefbottomrightdifferencex; } int calculatebottomy(int realy,int id) { if(id==1) homecoming realy+imageabottomrightdifferencey; if(id==2) homecoming realy+imagebbottomrightdifferencey; if(id==3) homecoming realy+imagecbottomrightdifferencey; if(id==4) homecoming realy+imagedbottomrightdifferencey; if(id==5) homecoming realy+imageebottomrightdifferencey; homecoming realy+imagefbottomrightdifferencey; } void setistopconnected(boolean istopconnected) { this.istopconnected = istopconnected; } void setisbottomconnected(boolean isbottomconnected) { this.isbottomconnected = isbottomconnected; } }

given images provided straightforward connect them in generic way because images have same width , have transparent background, here idea:

1- need overlap distance between 2 images, can calculate either bottom or top image

the greenish line in bottom image should equal reddish line in top picture

given images have transparent background can calculate distance easily, utilize bottom image here.

the thought check every pixel in lastly column of bottom bitmap (i.e. width - 1) , stop 1 time nail non-transparent pixel.

private int getoverlapdistance(bitmap bottombitmap) { int height = bottombitmap.getheight(); int width = bottombitmap.getwidth(); int distance = 0; (int = 0; < height; i++) { if (color.alpha(bottombitmap.getpixel(width - 1, i)) != 0) { distance = (i + 1); break; } } homecoming distance; }

to connect them can (assuming have separate imageview top , bottom image):

bitmap = ((bitmapdrawable) bottomimage.getdrawable()).getbitmap(); int overlapdistance = getoverlapdistance(bitmap); bottomimage.settop(topimage.getbottom() - overlapdistance);

actually tried simple activity , working, here how before , after connecting 2 images:

i execute above code when button connect clicked

android design