Android - horizontal images to fit screen - android

I have an Android horizontal LinearLayout with 5 images in it. I want the 5 images to fit the screen horizontally while keeping the aspect ratio. Each image is 128x128 pixel.
The problem is that while the width is set like what I wanted the height of the images remain the same, so they look like this on a bigger screen (this is the Nexus 7):
What I have now:
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:cropToPadding="true"
android:scaleType="fitXY"
android:src="#drawable/image01" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:scaleType="fitXY"
android:src="#drawable/image02" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:scaleType="fitXY"
android:src="#drawable/image03" />
<ImageView
android:id="#+id/imageView4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:scaleType="fitXY"
android:src="#drawable/image04" />
<ImageView
android:id="#+id/imageView5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:scaleType="fitXY"
android:src="#drawable/image05" />
</LinearLayout>
Thanks for the help

change the scaleType to centerInside or fitCenter and height to match parent.

try to surround the imageview with a horizontal LinearLayout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_weight="1"
android:layout_gravity="center">
<ImageView
android:id="#+id/btnHome"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:tag="btnhome" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_weight="1"
android:layout_gravity="center">
<ImageView
android:id="#+id/btnGames"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:tag="btngames" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_weight="1"
android:layout_gravity="center">
<ImageView
android:id="#+id/btnNews"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:tag="btnnews"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_weight="1"
android:layout_gravity="center">
<ImageView
android:id="#+id/btnPayment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:tag="btnpayment"/>
</LinearLayout>
then, change the scaleType to fitCenter.
it will cause your pictures to have a correct ratio event you view it in a wider screen.

I found some code to create a square view that I could then use to render my own custom graphics in. You should be able to something like this:
public class SquareImageView extends ImageView {
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int width = getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);
int height = getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec);
int length = Math.min(width, height);
setMeasuredDimension(length, length);
}
}
I haven't tried this squaring code in a LinearLayout but when use RelativeLayout where it was positioned first and attached to three sizes of the parent it worked nicely. This is hoping that ImageView does the right thing with the image, otherwise you're going to have to override the onDraw() method too.

Related

Size of imageView in LinearLayout

I have a horizontal LinearLayout with 3 ImageViews, but ImageView are much more wider than image are(rectangle when image is square). I've try to set adjustViewBound="true", than imageView become square but much more bigger.
Also I've tryed to set scaleType="firXY" but then the image is scaling to fit rectangle imageView.
Here is ma xml:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/llButtons">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_start_text"
android:id="#+id/imgStart"
android:layout_weight="1.5"
android:src="#drawable/ic_play"/>
<ImageView
android:id="#+id/imgReset"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1.5"
android:text="#string/button_reset_text"
android:src="#drawable/ic_cls"/>
<ImageView
android:id="#+id/btnNext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1.5"
android:text="#string/button_next_text"
android:src="#drawable/ic_next"/>
</LinearLayout>
And this is a result:
How can I set ImageView size as picture size?
You had assigned the weight as 1.5 and this makes the issue.
Anyway You can adjust the width of each images By previewing the layout.
Preview the layout
Now Double Click on the layout Content.
Now You will be able to adjust the height and width of those imageviews.
Adjust it with proper height and width.
This gives you the proper idea how to manage items in a Linear Layout.
Try setting scaletype to CENTER_INSIDE
I assume you want to keep the images equidistant horizontally. Create a LinearLayout for each image, give each a weight of 1 (remove weights from ImageViews), and set each LinearLayout's gravity to center.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/llButtons"
android:weightSum="3">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_start_text"
android:id="#+id/imgStart"
android:src="#drawable/ic_play"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
>
<ImageView
android:id="#+id/imgReset"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_reset_text"
android:src="#drawable/ic_cls"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
>
<ImageView
android:id="#+id/btnNext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_next_text"
android:src="#drawable/ic_next"/>
</LinearLayout>
</LinearLayout>
Thank you all, I've solved it.
Following advice of #Khizar Hayat I've delete wight attribute and use wrap content instead. To place my ImageViews by screen sides and center I've using .
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/llButtons">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_start_text"
android:id="#+id/imgStart"
android:src="#drawable/ic_play"/>
<Space
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"/>
<ImageView
android:id="#+id/imgReset"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_reset_text"
android:src="#drawable/ic_cls"/>
<Space
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"/>
<ImageView
android:id="#+id/btnNext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_next_text"
android:src="#drawable/ic_next"/>
</LinearLayout>
Fix ImageView's size with a specific size (in dp) or use fill_parent
set android:scaleType to fitXY.

Resize Image to fit Parent layout height and width

I want to fit an Imageview according to Height and width of my RelativeLayout without disturbing its ratio. I am using a LinearLayout with a weightSum and adding two other layouts ie RelativeLayout with weight 20 and LinearLayout with weight 80. I am adding the imageview to the RelativeLayout to take up weight 20 but currently, my image takes up the width to its content and does not follow the width of the parent, thus resulting in pushing the other layout.
My Layout is as below:
layout.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/order_detail_container"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginLeft="4dp"
android:layout_marginRight="8dp"
android:layout_marginTop="16dp"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground"
card_view:cardCornerRadius="2dp"
card_view:cardElevation="1dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="100"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="20">
<Droid.CenterFitImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:adjustViewBounds="true"
android:id="#+id/imgArticleThumb"
android:src="#drawable/Icon" />
</RelativeLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="80"
android:padding="5dp"
android:orientation="vertical">
<Droid.CustomTextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/txtCategory"
card_view:customFont="Fonts/Roboto-Bold.ttf"
android:textColor="#color/CatTitle"
android:textSize="12sp"
android:text="Category" />
<Droid.CustomTextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/txtTitle"
android:ellipsize="end"
android:singleLine="true"
card_view:customFont="Fonts/Roboto-Bold.ttf"
android:textColor="#000000"
android:textSize="16sp"
android:text="Title" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
CenterFitImageView.cs
protected override void OnMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
try
{
if (Drawable != null)
{
int w = MeasureSpec.GetSize(widthMeasureSpec);
int h = (int)Math.Ceiling((float)w * (float)Drawable.IntrinsicHeight / (float)Drawable.IntrinsicWidth);
SetMeasuredDimension(w, h);
}
else
base.OnMeasure(widthMeasureSpec, heightMeasureSpec);
}
catch (Exception e)
{
base.OnMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
Expected output:
My output:
layout_width="wrap_content" on your root LinaerLayout, is where you have gone wrong. You have to use match_parent if you need your views to be aligned properly according to their weights.
Just remember that if you are using layout_weights and weightSum, then you have to give the root layout and specific width or height depending upon the arrangement. wrap_content, means display your layout, according to whatever size the child is.
So the resulting code will be
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="100"
android:orientation="horizontal">
....
....
</LinearLayout>
And this is the output that I got
The first RelativeLayout with the ImageView is taking 20, and the other one with a TextView is taking 80.
First of all why you didn't use Linearlayout instead of RelativeLayout. When you are using all LinearLayout.
I will do this in this way.
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/order_detail_container"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginLeft="4dp"
android:layout_marginRight="8dp"
android:layout_marginTop="16dp"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground"
card_view:cardCornerRadius="2dp"
card_view:cardElevation="1dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="100"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="40"
android:gravity="center">
<Droid.CenterFitImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:id="#+id/imgArticleThumb"
android:src="#drawable/Icon" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="60"
android:orientation="vertical"
android:layout_marginLeft="5dp">
<Droid.CustomTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/txtCategory"
card_view:customFont="Fonts/Roboto-Bold.ttf"
android:textColor="#color/CatTitle"
android:textSize="12sp"
android:text="Category" />
<Droid.CustomTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/txtTitle"
android:ellipsize="end"
android:singleLine="true"
card_view:customFont="Fonts/Roboto-Bold.ttf"
android:textColor="#000000"
android:textSize="16sp"
android:text="Title" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
Just used android:layout_height="wrap_content" instead of match_parent for ImageView and also set your textview height and width wrap_content.
replace the layout_width="0" of the image with maxwidth.

Achieving a square imageview content for TableLayout with stretchColumns

currently I'm currently trying to achieve a squared ImageViews inside a TableRows which is supposed to be squared even if the columns are stretched but unfortunately it doesn't work the way I expected it to be. The plan is pretty simple. Use a TableLayout to host a number of ImageViews but make those imageviews squared inside even if the it is stretched. Here's what I tried so far.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context=".MyActivity">
<TableLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="*">
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:baselineAligned="false">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/img1"
android:src="#drawable/ic_launcher"
android:scaleType="centerCrop"
android:adjustViewBounds="true"
android:cropToPadding="true"
android:layout_alignTop="#+id/img2"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/img2"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/img1"
android:layout_toEndOf="#+id/img1"
android:src="#drawable/ic_launcher"
android:scaleType="centerCrop"
android:adjustViewBounds="true"
android:cropToPadding="true" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/img3"
android:layout_toEndOf="#+id/img2"
android:src="#drawable/ic_launcher"
android:scaleType="centerCrop"
android:adjustViewBounds="true"
android:cropToPadding="true"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/img2" />
</TableRow>
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tableRow">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/img4"
android:src="#drawable/ic_launcher"
android:scaleType="centerCrop"
android:adjustViewBounds="true"
android:cropToPadding="true"
android:layout_alignTop="#+id/img6"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/img5"
android:layout_toEndOf="#+id/img6"
android:src="#drawable/ic_launcher"
android:scaleType="centerCrop"
android:adjustViewBounds="true"
android:cropToPadding="true"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/img6" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/img6"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/img4"
android:layout_toEndOf="#+id/img4"
android:src="#drawable/ic_launcher"
android:scaleType="centerCrop"
android:adjustViewBounds="true"
android:cropToPadding="true" />
</TableRow>
</TableLayout>
</RelativeLayout>
I expect the image to fill the width and height on those imageViews to create squared images based on my original image using this code:
private Bitmap sliceImage(int my_img, int col, int row) {
/*send the original full image int id here then slice and return per icon*/
Bitmap icon = BitmapFactory.decodeResource(getResources(), my_img);
int width = icon.getWidth();
int height = icon.getHeight();
int crop_width = width / 3;
int crop_height = height / 3;
Bitmap test = Bitmap.createBitmap(icon, col * crop_width, row * crop_height, crop_width, crop_height);
return test;
}
and this to set:
ImageView img1 = (ImageView) findViewById(R.id.img1);
img1.setImageBitmap(sliceImage(R.drawable.my_img,0,0));
and so on. But the the image is just stretched on its width but the height is not adjusted.
For sample it looks like this:
Where it should be more like this but stretched in both width and height:

Custom View Wrap content override OnMeasure

I have created a custom view in which a bitmap is drawn. The problem is that the custom view takes up the whole screen regardless of the layout width/height I set it or it's parent.
I have been going through the forums and I read about overriding the onmeasure method, but for me that returns zero so now the width and height are set to zero.
Here is what I have done so far:
EDIT
FULL xml:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:sliderView="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/black">
<RelativeLayout
android:id="#+id/cameraLayout"
android:layout_width="wrap_content"
android:background="#color/black"
android:layout_height="wrap_content">
<SurfaceView
android:layout_alignParentTop="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/surfaceview">
</SurfaceView>
<LinearLayout
android:layout_above="#+id/beerName"
android:id="#+id/beerColours"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/beer1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/beer1"
android:layout_weight="1"/>
<ImageView
android:id="#+id/beer2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/beer2"
android:layout_weight="1"/>
<ImageView
android:id="#+id/beer3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/beer3"
android:layout_weight="1"/>
<ImageView
android:id="#+id/beer4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/beer4"
android:layout_weight="1"/>
<ImageView
android:id="#+id/beer5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/beer5"
android:layout_weight="1"/>
<ImageView
android:id="#+id/beer6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/beer6"
android:layout_weight="1"/>
</LinearLayout>
<EditText
android:background="#color/black"
android:id="#+id/beerName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:layout_above="#+id/seperator"
android:hint="#string/beer_name"
android:textColorHint="#color/white"
android:gravity="center_horizontal"
/>
<ImageView
android:id="#+id/seperator"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/dotted_separator"
android:layout_above="#+id/sliderViewLayout"/>
<RelativeLayout
android:id="#+id/sliderViewLayout"
android:layout_above="#+id/bottomsUp"
android:background="#color/black"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.test.bottomsup.custom_slider_library.sliderView
android:layout_marginLeft="15dp"
android:id = "#+id/sliderview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
sliderView:diagonalSlide="false"
sliderView:translateAxisX="false"
/>
<ImageView
android:id="#+id/slider_frame"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/glass"
android:layout_centerHorizontal="true"
android:layout_alignParentLeft="true">
</ImageView>
</RelativeLayout>
<com.test.bottomsup.custom.Components.ShadyButton
android:id="#+id/bottomsUp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/button_red"
android:textColor="#color/white"
android:text="#string/button_bottoms_up"
android:layout_alignParentBottom="true" />
</RelativeLayout>
</RelativeLayout>
In my fragment where I set the custom view is a follows:
sliderView slider = (sliderView)view.findViewById(R.id.sliderview);
slider.setImageResource(R.drawable.beer_with_arrows);
slider.requestLayout();
Then in my custom view class I call onMeasure as follows:
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int wrapHeight = getWidth();
int wrapWidth = getHeight();
this.setMeasuredDimension(wrapHeight, wrapWidth);
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
wrapHeight and wrapWidth are returned as zero. Could anyone offer some advice? I'm new to custom views etc so I'd appreciate the dig out ;)
****EDIT****
I should add that this is a slider, so in my custom view I am using the onscroll method...I imagine that might change things. So I have a frame image under which my view is scrolled, so I guess I need to set the height of my view to twice the frame height??
Can anyone help?
layout structure

ScaleToFit Layout Quandry

I'm try learn to more about the Android layout system; this is a learning experience for me. I'm currently trying to create a layout which basically amounts to two linear layouts: A fill_parent vertical, with an inner fill_width horizontal, so that I have an ImageView banner [in the outer], then seven ImageButton columns filling the width of the view [in the inner].
My issue comes, as I need the ImageButton's content to proportionally fill the entire button view [the columns], but respect the ImageButton boundaries, so that if either a small or big image is the source, it will be centered in the ImageButton, filling both it's vertical and horizontal dimensions, and be centered. -I have no control over the source images.
I thought that CenterCrop would do it, but nada for me...
ImageView.ScaleType CENTER_CROP Scale the image uniformly (maintain the image's aspect ratio) so that both dimensions (width and height) of the image will be equal to or larger than the corresponding dimension of the view (minus padding).
Any related thoughts on what I have; ignore the outer outer layout please:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout android:id="#+id/linearLayout2"
android:layout_height="fill_parent" android:orientation="vertical"
android:layout_width="fill_parent" android:background="#color/special_grey"
android:layout_margin="0dp">
<ImageView android:id="#+id/imageView1"
android:layout_height="wrap_content" android:layout_gravity="center"
android:layout_width="wrap_content" android:layout_margin="10dp"
android:src="#drawable/banner_logo" />
<LinearLayout android:id="#+id/linearLayout1"
android:layout_margin="5dp" android:layout_gravity="center"
android:layout_width="fill_parent" android:layout_height="250dp" android:baselineAligned="true">
<ImageButton android:minWidth="20dp"
android:adjustViewBounds="true" android:layout_margin="0dp"
android:src="#drawable/sample_0" android:maxWidth="100dp"
android:id="#+id/imageButton1" android:layout_weight="1"
android:scaleType="centerCrop" android:cropToPadding="true"
android:layout_gravity="center" android:layout_width="0dp"
android:padding="0dp" android:layout_height="250dp" />
<ImageButton android:minWidth="20dp"
android:adjustViewBounds="true" android:layout_margin="0dp"
android:src="#drawable/sample_1" android:maxWidth="100dp"
android:id="#+id/imageButton2" android:layout_weight="1"
android:cropToPadding="true"
android:layout_width="0dp"
android:padding="0dp" android:layout_height="250dp" android:scaleType="centerCrop" android:scrollbarAlwaysDrawHorizontalTrack="false" android:scrollbarAlwaysDrawVerticalTrack="false" android:layout_gravity="fill"/>
<ImageButton android:minWidth="20dp"
android:adjustViewBounds="true" android:layout_margin="0dp"
android:src="#drawable/sample_2" android:maxWidth="100dp"
android:id="#+id/imageButton3" android:layout_weight="1"
android:cropToPadding="true" android:layout_gravity="center"
android:layout_width="0dp" android:padding="0dp"
android:layout_height="250dp" />
<ImageButton android:minWidth="20dp"
android:adjustViewBounds="true" android:layout_margin="0dp"
android:src="#drawable/sample_3" android:maxWidth="100dp"
android:id="#+id/imageButton4" android:layout_weight="1"
android:cropToPadding="true" android:layout_gravity="center"
android:layout_width="0dp" android:padding="0dp"
android:layout_height="250dp" />
<ImageButton android:minWidth="20dp"
android:adjustViewBounds="true" android:layout_margin="0dp"
android:src="#drawable/sample_4" android:maxWidth="100dp"
android:id="#+id/imageButton5" android:layout_weight="1"
android:cropToPadding="true" android:layout_gravity="center"
android:layout_width="0dp" android:padding="0dp"
android:layout_height="250dp" />
<ImageButton android:minWidth="20dp"
android:adjustViewBounds="true" android:layout_margin="0dp"
android:src="#drawable/sample_5" android:maxWidth="100dp"
android:id="#+id/imageButton6" android:layout_weight="1"
android:cropToPadding="true" android:layout_gravity="center"
android:layout_width="0dp" android:padding="0dp"
android:layout_height="250dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
My comments are only small suggestions as I'm not really sure what you want to achieve with this layout or how it should look like eventually, maybe you could elaborate a little bit or add a small image for a better understanding.
I think your linearLayout1 is missing an orientation, but this shouldn't be critical as it should default to vertical (I think).
Couldn't you put the Image of your ImageView as a backgroundImage for your linearLayout2? Then you could skip the ImageView.
Then I would put most of the ImageButton attributes into a styles-definition. This allows you to change settings much easier and cleans up your code ([Android Developers: Applying Styles and Themes])1
As I have said before, maybe you could elaborate a little bit more about how it should look like, then it will be easier to help.

Categories

Resources