Zoomable RoundImageView - RoundImageView is still rectangle - java

I am trying to make zoomable RoundImageView. I am using this TouchImageView
but I extend it with RoundedImageView not with standard ImageView. This TouchImageView is in some FrameLayouts which have these these backround:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#FFF"/>
This background also have TouchImageView. When I call on it function setOval(true) everything seems fine, until I start zooming. It's look like it only create rounded bitmap, but ImageView is still rectangle...
PS: I need to have oval not circle.
There are some images:
Before zooming:
After zooming:
Thank you for every answer! ;)

For thoose who have the same issue. I find MaskableFrameLayout which is pretty easy to use. It extends FrameLayout so it's possible to have zoomable view in it. Just create oval or your shape in drawable:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#FFFFFF"/></shape>
and use setMask(drawable). Also you need to setPorterDuffXferMode(...). I used DST_IN.
Hope it helps!

Related

Rounded corners in layout with custom color on Android

I've got an xml for the shape and color of my drawable :
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#color/light_red"/>
<corners android:radius="10dp"/>
</shape>
But I would like to use this drawable as a global one, like having the corners rounded when I'm using it, but being able to change the backgroundColor.
But when I'm trying to change the backgroundColor programatically, it overrides the color like I want but it also override the rounded corners which becomes flat.
For the moment, if I want to have rounded corners with different colors, I need to create multiple XML files with only the android:color changing.
To programmatically change a color globally defined in a shape, use this:
findViewById(R.id.your_xml_element).getBackground().setColorFilter(Color.BLUE, PorterDuff.Mode.SRC_ATOP);
Just for other people coming here after, I did some research with what you gave me, this setColorFilter is deprecated since API 29.
I found the solution for non deprecated method (a little bit longer but working):
findViewById(R.id.your_xml_element).getBackground().setColorFilter(BlendModeColorFilterCompat.createBlendModeColorFilterCompat(Color.BLUE, BlendModeCompat.SRC_ATOP));

Best way generate small solid circle on a blank screen in a specific position?

--> a number of circles will be drawn over a period of time but only one will be shown on screen at a time.
--> user will click on the circle when the program registers the click, it will show the next circle.
--> the position of each circle is known, only they will appear randomly at different execution.
I have considered a linear layout filled with a lot of imageview(30 of them), every imageview has the same source, a small red dot, generated and stored in the res/drawable folder. code for the dot is:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Large red circle -->
<item>
<shape
android:shape="oval">
<stroke
android:width="0dp"
android:color="#000000" />
<solid android:color="#FF0000" />
<size
android:width="30dp"
android:height="30dp"/>
</shape>
</item>
I am thinking about using isVisible() on these imageviews to hide and show them at different times. this doesn't seem very efficient to me. any suggestions?
The best way to achieve that is to create a single custom View with onDraw overridden.
Then, inside onDraw you can simply draw as many circles as you want on the Canvas object. There are thousands of threads here on StackOverflow describing how to do that. E.g. this one.
Remember that you will have to call setWillNotDraw(false) on your View to cause your custom onDraw to be executed.
When the user clicks on the circle, simply record that even and call invalidate(). onDraw will be called once again and you can draw proper number of circles for the updated state.

Android rectangle gradient centerX not working

I'm trying to make a gradient effect for my ListView item background.
So I created a new drawable XML with the following content:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:centerX="10%"
android:startColor="#FF0000"
android:endColor="#FFFFFF"
android:angle="0" />
But it seems that the centerX attribute isn't working since the centerX point is still at 50%. And if I change centerX to any other value no changes are made.
I also tried to use decimal numbers (0.1) but still no success.
Thank you very much :)
In case of a linear gradient the centerX attribute corresponds to the position of the centerColor (which you did not define).
Something like this should work:
<gradient
android:startColor="#FF0000"
android:centerColor="#FF0000"
android:centerX="10%"
android:endColor="#FFFFFF" />

Android how to clip view with XML Circle shape?

I need to draw an empty circle and I know I can have one like this :
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadius="0dp"
android:shape="oval"
android:thicknessRatio="2"
android:useLevel="false" >
<solid android:color="#android:color/transparent" />
<stroke
android:width="2dp"
android:color="#android:color/darker_gray" />
</shape>
and then I just have to set it to any view's background and there it shows on the screen.
However, the view containing the circle as background is a square (or a rectangle) with a defined height and width. Therefore, the circle is drawn inside the view.
But what if I want to clip that said view ?
Let's my view-circle is inside a Layout (Linear or Relative) and fills up the parent (match_parent). Let's say this layout is red. What I want to do, is use the circle to clip the red layout so that only the red is shown inside the circle : the red must not leave the circle bounds.
Somehow, I can manage, with android:clipChildren="true" so that nothing goes further than the view squared borders. But that is not enough because the animated content do leave the circle and are halted at the view borders.
Is there any way to accomplish this ? I would like to remain on the XML level here. No canvas, not code to run at runtime. Is it possible ?
Thanks !

Android Java how to make single bar graphic

I need to show a "graphic" with part of the box colored in.
In the box it it will have text, but then I want to be able to put a color on the background to show how high the numbers are. see the graphic I made in excel. (I guess I am not allowed to upload a picture. So not sure how to explain this..
Click here to see the excel picture
Anyone know how to do this?
You can simply make an XML Drawable, something like this (save under res/drawable):
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
<gradient
android:angle="0"
android:type="linear"
android:startColor="#FF00FF00"
android:endColor="#FFFFFFFF"
/>
<stroke
android:width="1dp"
android:color="#FF000000"
/>
/>
then just use a TextView, with this Drawable set as your android:background attribute.
Do you want the colour to dynamically change colour for each value? Or are you okay with just having a few colour "levels" (e.g. red, yellow, green).
The easier route would be to just have a few set colours and create those gradients in photoshop and then apply those textures to the back of an ImageView using the background attribute.
Here are some tutorials on how views work: http://developer.android.com/resources/tutorials/views/index.html

Categories

Resources