User Tools

Site Tools


script_material_click_effect

====== About the script ====== * Purpose : It emulates the new material effect in any android version. * Author : [[https://plus.google.com/u/1/105066926163073195690|TrianguloY]] * Link: https://plus.google.com/u/1/105066926163073195690/posts/Bgcs6bsTacs (with video) ====== How to use the script ====== Instructions: Set the script to run in the tap action. Important: if you don't specify any extra data to the script the effect will be the one of the right. If you specify something (any) the effect will be the one of the left. Change the color selection in the box if necessary. After the animation finish the item will be launched. You can change the frames parameter in the script. More frames means smoother but slower. ====== Script code ====== <sxh javascript> var frames=7;//the more frames, the smoother and the slower //item var item=LL.getEvent().getItem(); //check if(LL.isPaused()||item.getTag("materialEffect")!=null) return; item.setTag("materialEffect","."); //vars var flag=LL.getEvent().getData()!=""&&LL.getEvent().getData()!=null; var size=[item.getWidth(),item.getHeight()]; var color=item.getProperties().getBox("i.box").getColor("c","s"); var extra=[0,0]; var savedimage=item.getBoxBackground("n"); var cell; //increase item size if(flag){ var cont=item.getParent() cell=item.getCell(); if(cell!=null)item.setCell(cell.getLeft()-1,cell.getTop()-1,cell.getRight()+1,cell.getBottom()+1); else{ item.setSize(size[0]+2*cont.getCellWidth(),size[1]+2*cont.getCellHeight()); item.setPosition(item.getPositionX()-cont.getCellWidth(),item.getPositionY()-cont.getCellHeight()); } if(savedimage!=null)extra=[cont.getCellWidth()*savedimage.getWidth()/size[0],cont.getCellHeight()*savedimage.getHeight()/size[1]]; } //image var var image=copyImage(savedimage)||LL.createImage(item.getWidth(),item.getHeight()); item.setBoxBackground(image,"n"); image=item.getBoxBackground("n"); //draw vars var canv=image.draw(); canv.scale(image.getWidth()/size[0],image.getHeight()/size[1]); var paint=new Paint(Paint.ANTI_ALIAS_FLAG); paint.setColor(color); var backcolor=Color.argb(Color.alpha(color)/2,Color.red(color),Color.green(color),Color.blue(color)); //item vars var center=[size[0]/2,size[1]/2]; //animation vars var max; //first image if(flag){ max=Math.min(center[0],center[1]); var backpaint=new Paint(Paint.ANTI_ALIAS_FLAG); backpaint.setColor(backcolor); canv.drawCircle(center[0],center[1],max,backpaint); }else{ max=Math.sqrt(center[0]*center[0]+center[1]*center[1]); canv.drawColor(backcolor); } //animation vars var step=max/frames; var current=0; //start the effect tick(); function tick(){ if(current<=max){ //draw the next step canv.drawCircle(center[0],center[1],current,paint); image.update(); //item.setLabel(current); //next step current+=step; setTimeout(tick,20); }else{ //reset item and finish item.setBoxBackground(savedimage,"n"); if(flag){ if(cell!=null)item.setCell(cell.getLeft(),cell.getTop(),cell.getRight(),cell.getBottom()); else { item.setSize(size[0],size[1]); item.setPosition(item.getPositionX()+cont.getCellWidth(),item.getPositionY()+cont.getCellHeight()); } } item.setTag("materialEffect",null); item.launch(); return; } } //helpers function copyImage(src){ if(src==null) return null; var bmp_orig = src.getBitmap(); var img_copy = LL.createImage(bmp_orig.getWidth()+extra[0]*2, bmp_orig.getHeight()+extra[1]*2); img_copy.draw().drawBitmap(bmp_orig, extra[0], extra[1], null); img_copy.update(); return img_copy; } </sxh>

script_material_click_effect.txt · Last modified: 2015/02/08 10:31 by trianguloy