put large number of equally sized ImageViews in a row - android

Within a layout I want to put 11 equally sized (more or less quadratic) ImageViews in a row. Only one of them shall be displayed at a point in time. It is crucial that the ImageView number x starts EXACTLY at x/11 of the screen width. This might sound trivial, but after some attempts and research I'm not so sure anymore.
What I tried so far is using a horizontal Linear Layout, putting 11 ImageViews in it and applying
android:layout_width="0dp"
android:layout_weight="0.0909"
to each of them and set visibility to VISIBLE for one of them and to INVISIBLE for all others in the code. Unfortunately this solution is not really reliable and I see that the position of the ImageViews vary slightly.
Another attempt, using the displayed ImageView as thumb of a seekbar and setting the seekbar's progress to number x was also not great on all devices I tested.
What is the best practice here to get stable results? Thanks in advance.

Related

Controlling the positions of a views in Android

I am trying to create an android app where I have a single relatively big button in the middle (the light blue in the picture) and it is surrounded by other smaller buttons as shown in the picture (some of small buttons might be visible or invisible based on some criteria).
I started with the RelativLayout setting the big on in the center and making the rest placed in relation to it, but it is a miss and the central button get shifted and doesn't stay in the center. I tried placing them in FrameLayout and used margin to adjust their locations, that worked the best however, the spacing changes on different screen resolutions.
So what is the best way to achieve such layout that will look consistent on any device?
Android's Percent Support Library allows you to use proportions to lay out your views, which may allow you to get closer to your goal.
http://developer.android.com/tools/support-library/features.html#percent

How to design single row of images?

I am trying to build a row of images. I want the number of images to increase based on screen width. For example, in portrait mode there may be 3 images present, but in landscape there would be five.
I have tried using a GridView, but I am having trouble stopping it from being populated after the first row has been filled (it goes to the next row). Is there an alternative view I should be using or is a GridView the right approach?
If you only want 1 row, then use a LinearLayout. If it needs to scroll, embed it in a HorizontalScrollView.
If you aren't scrolling you can then inflate and add each image, depending on available space.
You could make it more complex by creating custom classes, etc.
You can also try the Two-Way GridView (I've used it - it works great)
How to make grid-view horizontally scrollable in android
I have found a suggestion based off of this. Once a max width has been exceeded on the LinearLayout, simply stop adding to it!

Dynamic Android Layout Scaling (How-To?)

I'm stuck and I think wisdom (aka experience) is the only solution.
I need to be able to have boxes on a screen with data inside each box. The number of boxes on the screen needs to be able to change and the boxes need to scale accordingly (as well as the text data inside of them) to allow for the additional boxes.
Example: I might start with only 8 boxes which are evenly spaced and displaying data at a reasonable font scale.
As I add more boxes I need the rest of the boxes to scale down and allow everything on one screen.
I am currently attempting to use a TableLayout, but I'm not certain how to make everything scale correctly. Also, I'm generating everything programmatically by extending the TableLayout. Can someone point me in the right direction. Is there a better layout method that I'm not seeing? I'm sure I'm not the first person to need this, so are there examples available that I'm just not finding by searching?
The eventual solution was to build my own scaling function which took screen pixel dimensions and calculated the appropriate margin offsets to use on a relative layout. It requires a complete redraw each time the scaling factor changes, which is annoyingly resource intensive.

Which Android layout and view to use for simple image-based game?

I would like to make a simple Android game where a large background image is displayed and some other images are displayed in specific locations over it, where the other images may be clickable.
Here's a quick sample image of what I'm talking about:
The user should be able to tap the soccer player or the moose (ah, the classic "soccer player moose problem"!)
How should I render this screen (which layouts and views?) so the user can interact with it and it will scale properly on different devices?
I would use a RelativeLayout.
You can set the you background image to the layout (fill_parent for height and width).
You can then put your ImageViews, containing your moose and soccer player down on the layout relative to the top or sides of the sceen, or relative to each other (making sure to specify "dp" units for everything). Set the backgrounds of your ImageViews to be transparent, and there won't be a bounding box problem (and/or you can also set your ImageViews alignment to be relative to each other, ensuring they don't overlap).
I think this is the simplest way to do this - it is then super easy to attach onClickListener to your ImageViews in your Activity, and you are done.
This type of layout will work the same on all devices and screen sizes.
There are some small gotcha's with RelativeLayouts, but they are pretty simple once you get into them, and provide fast rendering (since the view hierarchy is usually shallow). Good Luck.
ImageView for the clickable elements seems like a fine choice to me. For the background I would just set your image as the background of the parent layout i.e. RelativeLayout
SurfaceView for the whole thing (with your field as a background) and regular *ImageView*s for added elements. You can easily recover the click coordinates from the SurfaceView and thus know what element has been touched.
SurfaceView might offer you additional possibilities anyway.
For most images, I'd use an ImageView for each one, like FoamyGuy said.
If they're close enough for overlapping bounding boxes to be an issue, you can still use an ImageView for each, but with a variation of this answer, testing alpha for each ImageView in range.
I would agree with both FoamyGuy and Booger that if your only goal is to place static images onto the screen that do something when you click them, RelativeLayout and ImageViews all the way.
But...
If you are looking to randomly spawn multiple images onto the screen in intervals and have them move around for the player to interact with while explosions are going off and maidens are being kidnapped, you should look into SurfaceView, Canvas, Drawable, TouchEvents, and FrameBuffers.

Android wallpaper program layouts

When I look at several of the more popular android walpaper programs, (HD Wallpapers and the like), they all seem to have a very similar layout with 4 pictures in a 2 x 2 grid where each takes up approximately 1/2 of the parent's respective width and height. After not having a lot of success emulating this with various combinations of layouts and objects, I am trolling for a pointer. Anyone who could get me pointed in the right direction would be greatly appreciated. Is there a standard mix to achieve this sort of view?
Side note: Please be gentle, it's my first time... asking a question. ;)
You could use a GridView with android:numColumns=2.
You can see a GridView example here. You would set the height by manipulating the LayoutParams on the views that you put inside the GridView (via its Adapter).
If that doesn't float your boat and you're not doing much scrolling, you can always create a TableLayout with TableRows of 2 Views apiece, or a vertical LinearLayout containing two horizontal LinearLayouts of 2 Views apiece.
What have you tried already? Can you expand on your use case a little bit more? Do the images need to scroll? Can they be static? Will there be more than 4 images on a page?

Categories

Resources