Basically What I'd like to try is to have all of my content in an image. I looked up some stuff but what they do is always use an imageView and text. But I'd like to use it as a background image.
Can someone give me an example how this exactly works? And how will the support be for using this with different screensizes, because the content always has to stay in the image?
To clarify what I want, I added an image. The green space is a background drawn in android xml, the white is the actually image and the text should be all of my content. I'd like to keep everything in the white, even if I get more edges.
The easiest way will be to have 3 layers
Top
Mask
Content
Image
Bottom
The mask will be an imageview (in your case only the green parts with the rest transparent).
The base image can be anything, but it would make sense that it complements the masking layer.
The content will be the tricky part. You will need to figure out the bounds of the masking layer so you won't go under the mask. I would suggest centering the content.
Alternatively, if the shape will change in size or is complex I would suggest using a canvas with a clipping pattern. On Android how do I make oddly shaped clipping areas?
Related
i want to make animated view as shown in the link
https://streamable.com/fpax52
there is an image selected and it should be rectangled and then animated with rgb
i have tried drawing canvas, but not sure that is proper way.
canvas?.drawBitmap(bitmap, 0f,0f,p)
it only drawes one image.
I also thought about creating multiple imageviews as rectangle but i think it is not good idea also.
How would I replicate this in Android, my general instinct would be to create a regular layout w/ a border, then have 2 layouts that contain a triangle (one the same color as the border + one that's slightly smaller but white and overlap the two), idk if there's an easier way to do that:
You can use 9patch to achieve something like you wanted.
The Draw 9-patch tool is a WYSIWYG editor that allows you to create
bitmap images that automatically resize to accommodate the contents of
the view and the size of the screen. Selected parts of the image are
scaled horizontally or vertically based indicators drawn within the
image.
A complete guideline can be found here : http://developer.android.com/tools/help/draw9patch.html
The easiest way to reach this, is to set the layout background to that image.
background="#drawable/template"
Probably you want to have the area out of the "bubble" transparent, so you will need to save it as PNG.
I am having trying to accomplish this kind of a design. It needs to stretch to accomodate difference screens but rather then stretching it should repeat the pattern, I think the picture is pretty self-explanatory. 9patch only wont cut it as it only stretches.
Thanks for your time
The simplest method to do what you want would be to use a shape drawable with the stroke element set on it to obtain that dash pattern.
You may be able to also do it with a layer-list drawable.
I am trying to create a drawable such as this in Android:
I don't think a nine patch will work because there is nowhere that can safety scale vertically. So next I tried a shape drawable but it does not support triangles.
I want to render this image on the fly so there are no artifacts. Also I want to be able to use it in a selector, so I need to be able to represent this image in xml. Maybe I need to extend some class to manually make the shape. If so how do I embed a tag in the xml to tell it where to render? Does anyone know where to start with this or have an example of something similar?
I have read the first 10 pages of hits on stack overflow and google and am not getting anywhere. Thanks very much for any help.
I think a 9-patch would work. For the vertical stretching on the left boundary, fill in the line from top to bottom.
In my app I have something similar in appearance to labels in GMail app UI. For those who may not know, they look like this (labels are these colorful bars):
In order to achieve similar effect I use nine-patch drawables - for each label I am creating a TextView and assign drawable to it. This is simple solution, but I don't like it. It's not elegant, it is quite slow as shown by profiler, and I just don't think it's the right way to do it.
I changed the design of the UI to make it more "ICS-y", so I removed rounded corners from the labels. And I started thinking how I could replace 9-patch solution. The most obvious thing is to use BackgroundColorSpan. But it has one, small drawback. I want my labels to have some padding. With drawables, it was easy to achieve. With spans, it's harder. To make horizontal padding, I can just add spaces at the beginning and at the end of the string. But how to make vertical padding larger? To clear things up, this is a screenshot of the label with BackgroundColorSpan:
I want to make the colored parts above and below the text larger. I think I should use some kind of MetricAffectingSpan, but I couldn't figure out which one. Or maybe I should write my own? Or, finally, maybe spans are just not able to fulfill my needs and I should stay with images or create a canvas and "manually" draw everything as in GMail app?
The easiest way to do this, and im pretty sure the GMAIL app is making use of it, are shapes.
Just create a custom shape, in your case a rectangle shape with rounded corners and a solid color, and assign this drawable then to the background property of your textview.
A shape is defined in xml.
You will assign it as follows:
<TextView
...
android:background="#drawable/my_awesome_shape" />