In the ListView from Android you got native an fading edge on the top and bottom of the view if you are getting to the end or top of the list while scrolling.
Now I was wondering if it was possible to build that same fading edge into the edges of the screen of my application? (So basically in my RelativeLayout)
Can someone give me some guidance on this?
Here is a picture for a better understanding for what I want to achieve.
If I drag an object to the left I want to fade in the blue edge and if I get closer to the edge it must be getting brighter and stronger as color.
What you need to do is put your RelativeLayout inside a HorizontalScrollview and add the following line to your HorizontalScrollview:
android:overScrollMode="always"
You also can do it in code:
yourHorizontalScrollview.setOverScrollMode(View.OVER_SCROLL_ALWAYS);
Check the following link if you want some more information.
http://developer.android.com/reference/android/view/View.html#setOverScrollMode(int)
Related
I have a plain old recyclerView next to a relativeLayout inside a verticalLayout. Nothing fancy about it at all. I am adding some progressBars instead the recyclerView and I was wondering if there's a way to have a cresent shape cut out of the left side of it. Kind of like those typical RPG portraits where the bars are curvered around the picture - only this would scroll around it.
Any pointers would be much appreciated.
Is it possible to move a button or any other element in relative layout to the absolute edge of the sreen? If I drag a certain element to the edge of the layout, eclipse will automatically place it a few dp away from the edge. It'll basically just create a small space between a button and the end of the creen. Is it possible to bypass that?
I know buttons aren't meant to be that close to the edge of the screen anyway, but I need it for a certain thing.
The normal button has a little padding by default, because the buttons backgroundimage is a 9-patch image with padding left, right and on bottom. That's why you see the space between button and screen.
To solve this you can use a custom button. For example change the backgroundimage of button like this android:background="#drawable/image".
I have a few issues and questions regarding some UI development on Android. Firstly look at this image:
Firstly at image A) This is a image that I insert and repeat horizontally to give the zig-zag shape at the top of the screen regardless of screensize and above that a textField with no content and a background color - But as I'm sure you can is that the two colors don't match up quite as perfectly as it should even though they both have the same hex color value (#BF0426). And secondly, you can also see some serious pixelation on that zig-zag image. How do I fix these 2 problems?
And then at image B) Here I have a simple listView. What I would like to do, is firstly indent it a bit on both sides, and round the corners of the top and bottom item. So basically I want it to look like the blue border drawn on the screenshot. (Your typical iOS listView). How do I go about doing this?
Thanks in advance for any tips!
For the image. Just out of curiosity, why wouldnt you simply extend your image to include the top pixels as well? In other words, build your repeating image such that it incorporates the pixels that you are trying to create using the empty textview. This will at least take care of the color missmatch, as the color will all be generated from the same place. In terms of the pixelation. Are you truly repeating the image, or are you spreading the image. A spreading will definitely cause what you are seeing.
For your tableview:
For the left and right indent, you can simply use the margin or padding attributes of tableview item. There are generic padding and/or margin attributes (which will pad all of the top, bottom, left and right), or there are separate padding and/or margin attributes for each top, bottom, left, and right. Here is a great link on padding versus margin that you may want to read.
Difference between a View's Padding and Margin
Example attribute (as called in an XML file) for bottom margin
android:layout_marginBottom
setMargins(left, top, right, bottom) // for setting margins programmatically
Example attribute (as called in an XML file) for top padding
android:paddingTop
setPadding(left, top, right, bottom) // for setting padding programmatically
For the custom top and bottom, you should be able to use the following tutorial
http://www.softwarepassion.com/android-series-custom-listview-items-and-adapters/
From here, you should be able to detect the item as the first and last item and set the background property (image) to a background image that has a rounded top or rounded bottom. This is how I do it on the iPhone. I have also implemented things that LOOK like tableviews but are simply vertical layouts with my own custom views that I have made to look like what you are wanting.
One thing to consider is the file format you use is going to mutate the image as you save it (lossy compression), so a .jpg with a certain color may look different than a .bmp with the same color. Make sure you author using the same application and/or export settings when trying to match up images.
Also, if you created your image with a DPI that is not compatible with the android display it can cause serious pixelation in detail areas, especially with gradients and drop shadows.
By default, the faded edge at the top of a ListView only shows up once you start scrolling through the list. Is there any way to have that top faded edge shading show up even when you haven't scrolled down at all?
Thanks!
In this case, I would remove the fading edge from the list view and just add an ImageView right above your ListView(perhaps both of them together in a layout) and make the src the drawable of the fading edge.
You can find the drawables in your sdk folder/platforms/platform-version/data/res/
I've got a pretty weird issue and can't find a solution. These two pictures show my problem:
In the first picture you can see, that there is no fading edge. If I move the bottom gallery a little bit further, the upper small gallery switches its position (I implemented this behaviour) and now there is a fading edge on both galleries.
The issue comes from the small gallery. But I don't understand why it is affecting the fading edge of the bigger gallery. The same effect appears on the right sight.
Both galleries are nested in a linear layout, which is nested again in a linear layout. I never touch the values for the fading edge.
Does somebody have an idea how to fix the issue?
It seems the fading is added automatically and disabling through XML doesn't work.
However disabling programatically seems to work:
Gallery carousel = (Gallery)findViewById(R.id.image_carousel);
carousel.setHorizontalFadingEdgeEnabled(false);