custom indeterminate progress drawable scaling - android

Trying to use a custom indeterminate drawable that will use vertical scaling. It comes out looking strange, it seems as though the bottom row of pixels are the only ones scaled, so it comes out looking like this.
I want it to be vertically scaled so it looks like a traditional candy-stripe indeterminate progress bar. The reason I need it to be scalable is that the area it will be covering will be weighted, so I can't have a static size.
Setting the minimum height seems to change nothing. Changing the drawables to 9-patch screws up the tiling (it turns into one png covering the whole area instead of horizontally tiling. In the end, I need horizontal tiling, and vertical scaling.
Anyone have an idea for me?
EDIT:
Reading up, I see in ProgressBar, that they wrap all your bitmaps like so:
final Bitmap tileBitmap = ((BitmapDrawable) drawable).getBitmap();
if (mSampleTile == null) {
mSampleTile = tileBitmap;
}
final ShapeDrawable shapeDrawable = new ShapeDrawable(getDrawableShape());
final BitmapShader bitmapShader = new BitmapShader(tileBitmap,
Shader.TileMode.REPEAT, Shader.TileMode.CLAMP);
shapeDrawable.getPaint().setShader(bitmapShader);
return (clip) ? new ClipDrawable(shapeDrawable, Gravity.LEFT,
ClipDrawable.HORIZONTAL) : shapeDrawable;
In otherwords, the force your bitmap to tile with Clamp, instead of respecting your original tile setting. I am sure there is a reason for this that I don't know. The only think I can think of is to write my own progress bar class that does my own tiling.

probably you should use pattern. see documentation drawable-resourse please look to the
"XML Bitmap" section of the document. there is a tileMode="repeat" i think this will solve you problem.
<?xml version="1.0" encoding="utf-8"?>
<bitmap
xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#[package:]drawable/drawable_resource"
android:antialias=["true" | "false"]
android:dither=["true" | "false"]
android:filter=["true" | "false"]
android:gravity=["top" | "bottom" | "left" | "right" | "center_vertical" |
"fill_vertical" | "center_horizontal" | "fill_horizontal" |
"center" | "fill" | "clip_vertical" | "clip_horizontal"]
android:tileMode=["disabled" | "clamp" | "repeat" | "mirror"] />

Related

Draw background height depending on a given value Android

I would like to have a background on my app that changes color depending on a given number. Let me elaborate some more. For example, I pass the number 40 out of 100, 2/5s of the screen should be x color, and the other 3/5s should be the other color. Here are two little diagrams:
40 / 100 40/60
+---+ +---+
| | 3/5 not filled in | | 1/3 not filled in
| | |...| 2/3 filled in
| | |...|
|...| 2/5 filled in +---+
|...|
+---+
So I was thinking I could go about making a dynamic background (giving a certain number) by drawing in the shapes. The problem is, I am not exactly sure how I would go about doing this. Where do I place the code to draw the shapes, and how exactly would I insert them into my XML file in the correct place (I already have a static color background that is up in my XML)?
Ok, you need to create an activity with two Linear Layouts. The width attribute will be set to match_parent and the height to 0dp. You will then be able to set the height with a layout weight of X %.
As an example, those layouts split the screen 25% 75% :
<LinearLayout
layout_weight="1"/>
<LinearLayout
layout_weight="3"/>
Give them an id to change values programmatically (weight and background color).
You can do it this way :
LinearLayout top = findViewById(R.id.top);
//Third Param stands for weight
LinearLayout.LayoutParams param = new LinearLayout.LayoutParams(
LayoutParams.MATCH_PARENT, 0, 1.0f);
top.setLayoutParams(param);
top.setBackgroundColor(Color.BLUE);

How to get width and height of displayed image in android?

This question may seem trivial and been asked many times, but I couldn't find an answer that will work for me.
I have an ImageView and GLSurfaceView that is drawn on top of ImageView when I push a button.
For my ImageView I pass a Bitmap and scale it down in order to avoid an OutOfMemoryError exception. My ImageView is aligned to other elements in my UI, so it stretches the image to fill width/height (this is what I want).
When I change from ImageView to GLSurfaceView I get black regions around my image that used to be transparent in my ImageView, because GLSurfaceView makes a hole in UI and works differently than usual elements it draws background of my image to black and I don't need it, because I have custom background.
I came down with a solution to set LayoutParams for GLSurfaceView programmatically and I use Bitmap width and height, but I end up with a smaller image. I need the exact width and height of the image displayed - not the ImageView because it has transparent regions.
PS: I'm not an OpenGL expert and if you have a solution that works for OpenGL please share it.
a)
_______________
| |
| |
|---------------| <-
| transparent |
|---------------| <- Entire
| | ImageView
| Image | need
| | only this
|---------------| <-
| transparent |
|---------------| <-
| |
---------------
b)
_______________
| |
| |
|---------------| <-
| black |
|---------------|
| |
| Image | GLSurfaceView
| |
|---------------|
| black |
|---------------| <-
| |
---------------
My ImageView and GLSurfaceView:
<android.opengl.GLSurfaceView
android:id="#+id/glsvImageHolder"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/horScrollImage"
android:layout_marginBottom="5dp"
android:layout_marginTop="50dp"
android:visibility="invisible" />
<ImageView
android:id="#+id/ivImageHolder"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/horScrollImage"
android:layout_marginBottom="5dp"
android:layout_marginTop="50dp"
android:visibility="visible" />
float widthPx = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_MM,
pxToMm(ivImageHolder.getWidth(), context),
getResources().getDisplayMetrics());
float heightPx = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_MM,
pxToMm(ivImageHolder.getHeight(), context),
getResources().getDisplayMetrics());
ViewGroup.LayoutParams layoutParams= glsvImageHolder.getLayoutParams();
layoutParams.width= (int) widthPx;
layoutParams.height= (int) heightPx;
glsvImageHolder.setLayoutParams(layoutParams);
Pixel to MM
public static float pxToMm(final float px, final Context context)
{
final DisplayMetrics dm = context.getResources().getDisplayMetrics();
return px / TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_MM, 1, dm);
}
Make GLSurfaceView' s width and height : wrap_content.

Create an image from two other

My problem is that i have one ImageView with my main image (fill the screen) and then i create another one ImageView which is smaller one, dragable and the image has transparent background.
I would like then after the positioning of the smaller ImageView to be able to create one image from this two as i see it on screen. My recent tries i have manage something like this but i have problems with the second image scaling,transparent background and positioning.
[update]
Here is my code. Using this i achieve retaining transparent background but the positioning of the image is wrong i cannot get the correct current position of the position of the second image view. Also, the second image scaling/quality is really bad.
Bitmap cameraImage = ((BitmapDrawable) photoView.getDrawable()).getBitmap();
Bitmap myIcon = ((BitmapDrawable) ( temp).getDrawable()).getBitmap();
myIcon= myIcon.copy(Bitmap.Config.ARGB_8888,true);
cameraImage =cameraImage.copy(Bitmap.Config.ARGB_8888,true);
Canvas canvas = new Canvas(cameraImage);
Rect r=canvas.getClipBounds();
r.left=0;
r.top=0;
r.bottom=r.bottom/2;
r.right=r.right/2;
canvas.drawBitmap(myIcon,null,r,null);
photoView.setImageBitmap(cameraImage);
[update]
The frame is my base Image View and the stars is the second Image View. When the second Image View has a final position lets say the position on the example, I would like to make a bitmap containing these two images. (maintaining transparent background to the second one)
-----------------
| |
| *** |
| *** |
| *** |
| |
| |
| |
| |
-----------------
Thanks,
Adamos
I used this code snippet which takes the screenshot from the parent view of the two images views.
parentView.buildDrawingCache();
Bitmap cache = Bitmap.createBitmap(parentView.getDrawingCache());
photoView.setImageBitmap(cache);
parentView.destroyDrawingCache();
Thanks #hypd09.

Custom view with 9patch bitmap as background

I want to create a custom view which has a 9-patch bitmap as background and can display two rows of text in the center of the view.
I have read the official guide on creating custom views but still don't know how to start.
I was able to draw the background in the onDraw() method using canvas.drawBitmap(..)
This, works, but how can i draw a 9-patch bitmap and set the width and height? (the image size should be like match_parent.
To summarize i want to create a view like this:
+------------------+
| |
| first row text |
| second row text |
| |
+------------------+
The box should have a 9-patch bitmap background and should have a width that matches the parent layout.
how can I implement this?
kind regards
I think just regular TextView can cover your requirements. Try this,
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:drawable/btn_default"
android:gravity="center"
android:minLines="2"
android:maxLines="2"
android:text="This is the first row \n This is the second row"/>
If you have any special reason to use CustomView, then don't need to build it from scratch, try to extend it from a proper one. (In your case TextView looks proper)

Android create border drawable programmatically

I would create a drawable as background of my list item. I'm trying to draw something like this in xml:
------------
|
|
|
| _|
So i need to draw the borders to two sides, top and left, and a "L" in the bottom right corner. I have no problems creating the top and left border but i can't imagine how to create the L in the bottom right corner. PS: the dimension of the L should be fixed and indipendent from the dimensions of the drawable.
Thanks
I have done it create a 9-patch png and then set it as background. i can also change the border color programmatically using a color filter over the drawable

Categories

Resources