Creating a Shape from a Drawable without pixel transparency in Android - java

I'm trying to create a Shape or a Rect from a Drawable but without the transparency of the Drawable.
As you can see here, the following button has transparency on its borders. My issue is that I'm creating a panel Editor and I want to avoid superposition of widget when I move a widget.
To achieve this, I have used the method : Rect.intersects(Rect)
However, the Rect used is the shape of the entire drawable(with the transparency) and it's create too much empty space.
EDIT: more informations
Here is my Editor, I succed to avoid superposition but the superposition is base on the Shape of the drawable (picture). And the picture's tranparency create some empty space on my panel.
and my check collision code, where tempRect is the current Moving widget
public boolean checkCollision(Rect tempRect,ArrayList<IHMObject> listWidget) {
float dimen = activity.getResources().getDimension(R.dimen.abc_action_bar_default_height)+ 38;
for(IHMObject widget :listWidget ){
int[]location = new int[2];
View v =(View)widget.getView();
v.getLocationInWindow(location);
//vérifier la postion du widget en fonctions des autres widgets de l'IHM
Rect staticRect = new Rect(location[0],location[1]-(int)dimen,location[0]+v.getWidth(),location[1]+v.getHeight()-(int)dimen);
if (this.id!=widget.id){
if (staticRect.intersect(tempRect)) {
//il y a une collision entre les deux rectangles
return true;
}
}
}
return false;
}

Create a round_shape.xml file in drawable folder like below
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<!-- you can use any color you want I used here gray color-->
<solid android:color="#ABABAB"/>
<corners android:radius="10dp"/>
</shape>
Set this Draweble like below
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:textColor="#ffffff"
android:src="#drawable/round_shape" // here is your round_shape
android:background="#000000"
android:text="Buttons" />

Related

How to draw circle in android by pressing a button?

I want to show small dots on screen while pressing a button, something like pin code...
switch (view.getId()){
case R.id.buttonNum1:
editor.putString("PinNumbers",getString(R.string.numberOne));
int x = 10;
int y = 30;
int r = 100;
Paint mPaint = new Paint();
mPaint.setColor(Color.BLACK);
Canvas mCanvas = new Canvas();
mCanvas.drawCircle(x,y,r,mPaint);
break;
You can achive by creating ripple effect
create one drawable name like pin_button_ripple in drawable-v21 folder and add bellow code
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:colorControlHighlight">
<item android:id="#android:id/mask">
<shape android:shape="oval">
<solid android:color="?android:colorPrimary" />
</shape>
</item>
</ripple>
Now in Layout file set it as a background of button and define click listener in activity
<Button
android:id="#+id/btnPinButton"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerInParent="true"
android:background="#drawable/pin_button_ripple"
android:padding="20dp"
android:text="10"/>
You will see the ripple effect in circle shape like we enter Pin
number or password via keyboard and showing that effect

How to set Random GradientDrawable Color programmatically - Android

I have a problem with ProgressBar. When i press the button "Start" Random function choose one color from array, but only the first color is set as "background", when i click one more time new color is choose but not set as background. When i exit from app and start it again new color is choose but now only one. I would like to have different background color all the time when i press the button.
activity_main.xml
<ProgressBar
android:id="#+id/circularProgressbar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:indeterminate="false"
android:max="100"
android:progress="100"
android:progressDrawable="#drawable/circular"
android:secondaryProgress="100" />
circular.xml
<?xml version="1.0" encoding="utf-8"?>
<item android:id="#+id/SecondaryProgress">
<shape
android:innerRadiusRatio="5.2"
android:shape="ring"
android:useLevel="true"
android:thicknessRatio="9.5">
</shape>
</item>
MainActivity.java
public void Start(){
Random random = new Random();
String[] hex_colors = {"F8ED31", "000000", "F7931D", "ED1C24", "7A1777", "ED135A", "71BF43"};
int random_hex = random.nextInt(hex_colors.length);
String color="#"+hex_colors[random_hex];
layers = (LayerDrawable) ContextCompat.getDrawable(this,R.drawable.circular);
shape = ( GradientDrawable) layers.findDrawableByLayerId(R.id.SecondaryProgress);
shape.setColor(Color.parseColor(color));
}

Twitter like Animation for an Android ImageView?

Twitter on iOS has this nice bird animation on start.
(Source)
How can I make such an animation with an Android ImageView?
As simple as:
findViewById(R.id.image_view).animate()
.setStartDelay(500)
.setDuration(1000)
.scaleX(20)
.scaleY(20)
.alpha(0);
Make sure the image view is centered in your layout:
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"/>
</FrameLayout>
To modify the animation further you can:
Delay the animation
Use an decelerating (or other) interpolator
Modify the scale factors
It's called Splash Screen and here is a tutorial how to achieve it - link
The difference is that you need to add after line
setContentView(R.layout.activity_splash);
Following code:
ImageView image = (ImageView) findViewById(R.id.imgLogo);
Animation animation = AnimationUtils.loadAnimation(this, R.anim.my_animation);
image.startAnimation(animation);
And add in your res/anim new file my_animation.xml contains
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<scale android:fromXScale="1.0" android:fromYScale="1.0"
android:toXScale="5.0" android:toYScale="5.0"
android:duration="3000" android:fillBefore="false"
android:pivotX="50%" android:pivotY="50%" />
<alpha android:fromAlpha="1.0" android:toAlpha="0.0"
android:duration="3000"/>
</set>
Agree with above answer but there is another solution: -
THis link may be useful for you just download the code and as per the link suggests
You can create in code:
// create and customize the view
SplashView splashView = new SplashView(context);
// the animation will last 0.5 seconds
splashView.setDuration(500);
// transparent hole will look white before the animation
splashView.setHoleFillColor(Color.WHITE);
// this is the Twitter blue color
splashView.setIconColor(Color.rgb(23, 169, 229));
// a Twitter icon with transparent hole in it
splashView.setIconResource(R.drawable.ic_twitter);
// remove the SplashView from MainView once animation is completed
splashView.setRemoveFromParentOnEnd(true);
or in XML:
<com.yildizkabaran.twittersplash.view.SplashView
xmlns:app="http://schemas.android.com/apk/res/com.yildizkabaran.twittersplash"
android:id="#+id/splash_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:icon="#drawable/ic_twitter"
app:iconColor="#color/twitter_blue"
app:duration="500"
app:holeFillColor="#color/white"
app:removeFromParentOnEnd="true" />
then to run the animation, simply call:
--> run the animation and listen to the animation events (listener can be left as null)
splashView.splashAndDisappear(new ISplashListener(){
#Override
public void onStart(){
}
#Override
public void onUpdate(float completionFraction){
}
#Override
public void onEnd(){
}
});`
Output will be
-Hope you find your answer.

How to make horizontal line in Android programmatically

I am trying to fill linear layout programmatically like this
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
LayoutParams.WRAP_CONTENT,
LayoutParams.WRAP_CONTENT
);
params.setMargins(dpToPx(6), 0, 0, 0);
kac.setLayoutParams(params);
LinearLay.addView(kac);
and I want to add (after every TextView (like kac)) a horizontal line like this one I have in my xml
<View
android:layout_width="fill_parent"
android:layout_height="1dip"
android:background="#B3B3B3"
android:padding="10dp"
/>
View v = new View(this);
v.setLayoutParams(new LinearLayout.LayoutParams(
LayoutParams.MATCH_PARENT,
5
));
v.setBackgroundColor(Color.parseColor("#B3B3B3"));
LinearLay.addView(v);
I recommend creating a drawable containing the line and setting it as a background to your textview. You would avoid unnecessary views.
Sample drawable could be:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#LINE_COLOR"/>
<padding
android:bottom="1dp"
/>
</shape>
</item>
<item>
<shape android:shape="rectangle">
<solid android:color="#BACKGROUND_COLOR"/>
</shape>
</item>
</layer-list>
And you can set it by
textView.setBackgroundResource(R.drawable.resource)
edit* example:
#Override
protected void onDraw(Canvas canvas)
{
//this would draw the textview normally
super.onDraw(canvas);
//this would add the line that you wanted to add at the bottom of your view
//but you would want to create your rect and paint outside of the draw call
//after onmeasure/onlayout is called so you have proper dimensions
canvas.drawRect(new Rect(0, this.getHeight()-1, this.getWidth(), this.getHeight()), mPaint);
}
if i understand that you are just looking to draw a line after every textview, your best bet is probably to just extend TextView with a custom class, overriding the onDraw method, adding a paint call to draw the line yourself
you just need to set style (background) to your TextViews, making Views to in this case is a waste

My background image is being drawn too big for the canvas

The background I'm trying to draw for my app seems to be getting scaled too large for some reason. I made sure the emulator is WVGA800, have it set up in the manifest and layout to be full screen and landscape (just like the image which is 800 x 480). I just don't see where it would scale the image.
Here's a picture of the problem. The image when put in the emulator, and then the actual image.
Here's some relavant code:
/* mBackground instantiated in the class constructor */
mBackground = BitmapFactory.decodeResource( mContext.getResources(), R.drawable.background );
private void doDraw( Canvas canvas )
{
canvas.drawBitmap( mBackground, 0, 0, null );
}
Here's the layout
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
<com.project.game.GameView
android:id="#+id/game"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
</RelativeLayout>
</FrameLayout>
one possibility is to create a canvas with a viewport
public void onDraw(Canvas canvas) {
Bitmap myImg = BitmapFactory.decodeResource(getResources(),
R.drawable.cal_blank);
canvas.setViewport(800, 480);
canvas.drawBitmap(iconImg, 0, 0, new Paint(););
}
another way is to scale your image with this method http://www.anddev.org/resize_and_rotate_image_-_example-t621.html
Just a guess - maybe it depends on what folder type is used to put the image in. Could you say where did you put the image? I mean, is it the /res/drawable-hdpi/ or anything else? Have you tried /res/drawable-nodpi/?

Categories