Custom View Wrap content override OnMeasure - android

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

Related

Android: Placing 6 Squares Horizontally using XML

I need to place 6 squares horizontally across the width of the screen. I know that I can achieve this as follows:
<LinearLayout
android:weightSum="6"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:id="#+id/firstSquare"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="60dp"/>
<View
android:id="#+id/secondSquare"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="60dp"/>
.
.
.
</LinearLayout>
I want to ensure that the height of each View in LinearLayout is equal to its width.
Is there any way I can achieve it directly via XML without using GridLayout, since weights are supported from API 21. My minimum SDK is API 16. I know that I can achieve this programmatically by getting the width of each View object and then setting its height equal to its width, but I want to avoid it.
here is java code for CustomView.java
public class CustomView extends LinearLayout {
public CustomView(Context context) {
super(context);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int parentWidth = MeasureSpec.getSize(widthMeasureSpec);
int parentHeight = MeasureSpec.getSize(heightMeasureSpec);
this.setMeasuredDimension(parentWidth, parentWidth);
super.onMeasure(widthMeasureSpec, widthMeasureSpec);
}
}
and sample_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="6">
<CustomView
android:id="#+id/firstSquare"
android:layout_width="0dp"
android:layout_weight="1"
android:background="#color/colorPrimary"
android:layout_height="wrap_content"/>
<CustomView
android:id="#+id/secondSquare"
android:layout_width="0dp"
android:layout_weight="1"
android:background="#color/colorPrimary"
android:layout_height="wrap_content"/>
<CustomView
android:id="#+id/thirdSquare"
android:layout_width="0dp"
android:layout_weight="1"
android:background="#color/colorPrimary"
android:layout_height="wrap_content"/>
<CustomView
android:id="#+id/fourthSquare"
android:layout_width="0dp"
android:layout_weight="1"
android:background="#color/colorPrimary"
android:layout_height="wrap_content"/>
<CustomView
android:id="#+id/fifthSquare"
android:layout_width="0dp"
android:layout_weight="1"
android:background="#color/colorPrimary"
android:layout_height="wrap_content"/>
<CustomView
android:id="#+id/sixthSquare"
android:layout_width="0dp"
android:layout_weight="1"
android:background="#color/colorPrimary"
android:layout_height="wrap_content"/>
may be helpful..
<LinearLayout
android:layout_gravity="center_horizontal"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="50dp">
<View
android:layout_width="50dp"
android:layout_height="match_parent"/>
<View
android:layout_width="50dp"
android:layout_height="match_parent"/>
<View
android:layout_width="50dp"
android:layout_height="match_parent"/>
<View
android:layout_width="50dp"
android:layout_height="match_parent"/>
<View
android:layout_width="50dp"
android:layout_height="match_parent"/>
<View
android:layout_width="50dp"
android:layout_height="match_parent"/>
</LinearLayout>

Make button stay visible when keyboard becomes visible

I have the next layout
And when keyboard comes up, i wan't that green marked part of layout stays always visible. Another words i need to see both EditText and Button.
Here is my code sketch:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:fab="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_margin="16dp"
tools:context="com.mynfo.concept.auth.AuthActivity">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/titleImageView"
android:layout_gravity="center"
android:src="#drawable/title_auth"
android:layout_weight="0"
android:layout_marginTop="48dp"
android:layout_marginBottom="48dp"
/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:layout_marginBottom="8dp"
android:focusable="true"
android:focusableInTouchMode="true"
>
<EditText
android:id="#+id/barcode_editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:inputType="number"
android:textColorHint="#color/darker_grey"
android:hint="edittext"
android:maxLength="15"
android:ellipsize="end"
android:ems="10"
android:background="#0000"
android:layout_gravity="left|center_vertical"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#android:drawable/ic_menu_camera"
android:layout_gravity="right|center_vertical"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/grey"
android:layout_gravity="bottom"/>
</FrameLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<com.melnykov.fab.FloatingActionButton
android:id="#+id/button_scan"
android:layout_width="64dp"
android:layout_height="64dp"
fab:fab_colorNormal= "#color/turquoise"
fab:fab_colorPressed= "#color/turquoise_black"
fab:fab_colorRipple= "#color/turquoise_light"
android:src="#android:drawable/ic_menu_camera"
android:layout_gravity="center"/>
</FrameLayout>
<Button
android:id="#+id/button_link_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Authorize"
android:background="#drawable/button_authorize_selector"
android:enabled="false"
android:layout_weight="0"
/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1.2">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center"
android:gravity="center">
<TextView
style="#style/TextViewPrimary"
android:layout_marginLeft="32dp"
android:layout_marginRight="32dp"
android:textSize="16sp"
android:text="Enter your name"
android:gravity="center" />
<com.mynfo.concept.views.FontFitTextView
style="#style/TextViewSecondary"
android:text="And then you will got the access"
android:gravity="center" />
</LinearLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/authenticatingView"
android:background="#fff">
<ProgressBar
style="?android:attr/progressBarStyleLarge"
android:indeterminateOnly="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/authenticatingProgressBar"
android:layout_gravity="center"/>
</FrameLayout>
</FrameLayout>
</LinearLayout>
What haven't worked: adjustPan, adjustSize with or without layout weights.
Maybe I'm doing something wrong?
Thanks for the further help.
P.S. I know that this code feels redundant, but there were some purposes like screen adapting.
In your AndroidMenifest.xml file inside your tag use
windowsSoftInputMode = "adjustResize"
Or take whole layout inside ScrollView
windowsSoftInputMode = "adjustPan"
Example code snippet:
<activity
android:name=".activityname"
android:label="#string/app_name"
android:windowSoftInputMode="adjustPan|adjustResize" >
</activity>
Use
android:fillViewport="true" tag in ScrollView. And to avoid layout size bugs, use margin in Top ScrollView and don't use it in ScrollView child.
And add this in OnCreate
scrollView = (ScrollView) this.findViewById(R.id.scrollView);
scrollView.setVerticalScrollBarEnabled(false);
imageView = (ImageView) findViewById(R.id.imageView);
this.findViewById(android.R.id.content).addOnLayoutChangeListener(new View.OnLayoutChangeListener() {
#Override
public void onLayoutChange(View v, int left, int top, int right, int bottom, int oldLeft, int oldTop, int oldRight, int oldBottom) {
scrollView.scrollTo(0, imageView.getHeight() + ((ViewGroup.MarginLayoutParams) imageView.getLayoutParams()).topMargin);
}
});
See the comments..

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.

Android ImageView Extra Spacing

I integrated a picture into my app page using ImgaeView and now there is excess space to the right of the image.
android:adjustViewBounds="true" Is not the answer
It does not fix the spacing issue
Here's the code:
<ImageView
android:id="#+id/f2lcase2"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitStart"
android:src="#drawable/f2lcase2" />
<TextView
android:layout_height="wrap_content"
android:gravity="left"
android:text="Common F2L Cases" />
I don't have enough rep to post the pic but there is a large amount of space between the image and the text.
Thanks!
Edit
Here is the full XML:
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.example.cube.F2l" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:orientation="horizontal" >
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TableRow
android:id="#+id/tableRow0"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:padding="3dip"
android:text="Common F2L Cases"
android:textSize="20sp" />
</TableRow>
<TableRow
android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/f2lcase2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:adjustViewBounds="true"
android:src="#drawable/f2lcase2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Common F2L Cases" />
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/f2lcase3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:adjustViewBounds="true"
android:src="#drawable/f2lcase3" />
</TableRow>
</TableLayout>
</LinearLayout>
Since your views are going to repeat many times, so you can use ListView for that.Also since your image is static, you can simply set Left Drawable of your TextView. So below is the layout for one row of the ListView
<LinearLayout 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"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center_vertical"
android:drawablePadding="5dp"
android:drawableLeft="#drawable/yourImage"
android:text="Common F2L Cases" />
</LinearLayout>
Try this !
<ImageView
android:id="#+id/f2lcase2"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:src="#drawable/f2lcase2" />
<TextView
android:layout_height="wrap_content"
android:gravity="left"
android:text="Common F2L Cases" />
Try to use this code it may help you:
public class MyImage extends ImageView {
public MyImage(final Context context, final AttributeSet attrs) {
super(context, attrs);
}
#Override
protected void onMeasure(final int widthMeasureSpec, final int heightMeasureSpec) {
final Drawable d = this.getDrawable();
if (d != null) {
// ceil not round - avoid thin vertical gaps along the left/right edges
final int width = MeasureSpec.getSize(widthMeasureSpec);
final int height = (int) Math.ceil(width * (float) d.getIntrinsicHeight() / d.getIntrinsicWidth());
this.setMeasuredDimension(width, height);
} else {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
}
In your xml do like this:
<com.exmple.myview.MyImage
android:id="#+id/ImageView3_Left"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:src="#drawable/bg_2"
></com.exmple.myview.MyImage>
that's it. This will solve your plroblem.

Android - horizontal images to fit screen

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.

Categories

Resources