I'm trying to create letter buttons in relative layout. The main problem is that I cant set buttons to stay 1:1 aspect ratio and to display it proper on screen.
This is what I want to achieve:
Buttons should always be 1:1 and text shout start from button middle.
So far I tried with grid layout and put buttons in 5x5 grinds. But if I set button w/h to let's say 50dp on some displays I can see only A B C and half of D.
Also I tried to put on LinearLayout like:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/adSponsor"
android:layout_below="#id/barSearch"
android:layout_margin="20dp">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:orientation="vertical">
<LinearLayout
android:id="#+id/buttonPanel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#drawable/letter_button"
android:gravity="center|top"
android:text="A"
android:textAlignment="gravity"
android:textColor="#color/red"
android:textSize="#dimen/letter_box_text"
android:textStyle="bold" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#drawable/letter_button"
android:gravity="center|top"
android:text="B"
android:textAlignment="gravity"
android:textColor="#color/red"
android:textSize="#dimen/letter_box_text"
android:textStyle="bold" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#drawable/letter_button"
android:gravity="center|top"
android:text="C"
android:textAlignment="gravity"
android:textColor="#color/red"
android:textSize="#dimen/letter_box_text"
android:textStyle="bold" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#drawable/letter_button"
android:gravity="center|top"
android:text="D"
android:textAlignment="gravity"
android:textColor="#color/red"
android:textSize="#dimen/letter_box_text"
android:textStyle="bold" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#drawable/letter_button"
android:gravity="center|top"
android:text="E"
android:textAlignment="gravity"
android:textColor="#color/red"
android:textSize="#dimen/letter_box_text"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
But in this case the buttons are not 1:1 aspect ratio.
Can anybody point me what is the proper way to achieve this. Also, Buttons shout be in middle. The distance between buttons and search bar and buttons between buttons and footer should be the same.
In order to get a square button I would suggest you to subclass the Button class and override the onMeasure method:
public class SquareButton extends Button {
public SquareButton(Context context) {
super(context);
}
public SquareButton(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SquareButton(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
#TargetApi(Build.VERSION_CODES.LOLLIPOP)
public SquareButton(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int width = MeasureSpec.getSize(widthMeasureSpec);
int height = MeasureSpec.getSize(heightMeasureSpec);
if(width > height) {
super.onMeasure(heightMeasureSpec, heightMeasureSpec);
} else {
super.onMeasure(widthMeasureSpec, widthMeasureSpec);
}
}
}
In order to get the even space between the buttons, I'd go as well with the LinearLayout approach and layout_weight set on the Buttons. You can skip setting the weightSum on the parent if your button count per row is variable.
In order to have the bottom of the letter start from the middle of the Button, maybe it's worth to try it to see if you can match the paddingBottom property of the Button with the textSize property. If not, I guess you'll have to override the onDraw method as well.
Ass this in your horizontal LinearLayout:
android:weightSum="5"
And this in your Buttons:
android:layout_weight="1"
This is assuming you have 5 buttons in each row.
As #iTurki pointed out, you should use weightSum and layout_weight combinations to spread the views evenly across the linearlayout.
That said, I understand that you still need to display your characters in square boxes.
For this you could use RelativeLayout containing ImageViews and use the ImageView as clickable buttons.
The advantage of ImageView is, you can set transparent square image as a background and use android:adjustViewBounds="true" so that the height of the imageview increases/decreases according to the horizontal width space available to the imageview. your layout should look something like this.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="5"
>
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="square_transparent_Image.png"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center"
android:textAlignment="center"
android:text="A"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="square_transparent_Image.png"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center"
android:textAlignment="center"
android:text="B"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="square_transparent_Image.png"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center"
android:textAlignment="center"
android:text="C"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="square_transparent_Image.png"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center"
android:textAlignment="center"
android:text="D"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="square_transparent_Image.png"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center"
android:textAlignment="center"
android:text="E"
/>
</RelativeLayout>
</LinearLayout>
Related
In my xml file I set each small circle (ImageView) to be the size of 25% of the screen with a Linear View and layout_weights.
Here is a screen shot from my phone (how it is supposed to look)
On my tablet it does not change the size to be 25% of the screen (this is how it looks)
My code consists of three LinearLayout's each containing ImageView's with weights of 0.25 out of 1.
Here is the code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent"
xmlns:ads="http://schemas.android.com/apk/res-auto">
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/imageView12"
android:src="#drawable/circle_big"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
<LinearLayout
android:id="#+id/wrapper"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="1.0"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true">
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.03125" />
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25"
android:id="#+id/imageView12"
android:src="#drawable/circle_white"
android:onClick="changeToScreenSelectLayout"
android:scaleType="fitCenter"
android:adjustViewBounds="true" />
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.09375" />
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25"
android:id="#+id/imageView12"
android:src="#drawable/circle_white"
android:onClick="changeToScreenSelectLayout"
android:scaleType="fitCenter"
android:adjustViewBounds="true" />
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.09375" />
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25"
android:id="#+id/imageView12"
android:src="#drawable/circle_white"
android:onClick="changeToScreenSelectLayout"
android:scaleType="fitCenter"
android:adjustViewBounds="true" />
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.03125" />
</LinearLayout>
<LinearLayout
android:id="#+id/wrapper"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="1.0"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:rotation = "120">
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.03125" />
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25"
android:id="#+id/imageView12"
android:src="#drawable/circle_white"
android:onClick="changeToScreenSelectLayout"
android:scaleType="fitCenter"
android:adjustViewBounds="true" />
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.4375" />
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25"
android:id="#+id/imageView12"
android:src="#drawable/circle_white"
android:onClick="changeToScreenSelectLayout"
android:scaleType="fitCenter"
android:adjustViewBounds="true" />
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.03125" />
</LinearLayout>
<LinearLayout
android:id="#+id/wrapper"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="1.0"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:rotation = "60">
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.03125" />
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25"
android:id="#+id/imageView12"
android:src="#drawable/circle_white"
android:onClick="changeToScreenSelectLayout"
android:scaleType="fitCenter"
android:adjustViewBounds="true" />
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.4375" />
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25"
android:id="#+id/imageView12"
android:src="#drawable/circle_white"
android:onClick="changeToScreenSelectLayout"
android:scaleType="fitCenter"
android:adjustViewBounds="true" />
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.03125"/>
</LinearLayout>
</RelativeLayout>
You cannot use a png file as your circle_white. You could technically make this work if you choose the correct android:scaleType, but it would result in horribly aliased renderings.
I would first delete your existing pngs (From each resource bucket) since they cannot be used for this. Then make a new file in drawable named "circle_white.xml". Put this in it, this will draw a circle with no intrinsic size. I.E. it will just fill whatever you render it with.
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="#fff"/>
</shape>
And then change from using ImageView's with a src of circle_white to a HeightMatchesWidthView with the background set to this new #drawable/circle_white. You would need to ensure the Views height matches the width which I did in a view extension below. To use this just make a new class somewhere and paste this in. In xml reference it by instead of having ImageView do com.whatever.HeightMatchesWidthView where the com.whatever is whatever package you put this in.
public class HeightMatchesWidthView extends View {
public HeightMatchesWidthView(final Context context) {
super(context);
}
public HeightMatchesWidthView(final Context context, final AttributeSet attrs) {
super(context, attrs);
}
public HeightMatchesWidthView(final Context context, final AttributeSet attrs, final int defStyle) {
super(context, attrs, defStyle);
}
#Override
protected void onMeasure(final int widthMeasureSpec, final int heightMeasureSpec) {
int width = getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);
setMeasuredDimension(width, width);
}
#Override
protected void onSizeChanged(final int w, final int h, final int oldw, final int oldh) {
super.onSizeChanged(w, w, oldw, oldh);
}
}
Instead of the HeightMatchesWidthView you could also use a PercentRelativeLayout instead and use that to force them to be square, and the correct size without having to extend View to add support for forcing square.
Following is my xml code. In my LinearLayout. I have two child views , which are aligned using weightSum. I have an ImageView whose Width is aligned properly due to weightSum, but the problem is with its height. I want it's Height to be same dimensions as of its width.
Is there any solution without using static dp values.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingBottom="5dp"
android:paddingLeft="5dp"
android:paddingRight="5dp">
<LinearLayout
android:background="#drawable/background_gradien_yellow"
android:weightSum="10"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_weight="6"
android:id="#+id/startbtn"
android:textStyle="bold"
android:alpha="0.8"
android:textColor="#fff"
android:text="#string/start"
android:layout_centerInParent="true"
android:background="#drawable/background_gradient_circular"
android:layout_width="match_parent"
android:layout_height="150dp"/>
<LinearLayout
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp"
android:orientation="vertical"
android:layout_weight="3"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:textColor="#color/White"
android:id="#+id/tv_challange_title"
android:textSize="20sp"
android:text="Early-Bird Challange"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/tv_challange_desc"
android:alpha="0.5"
android:textColor="#color/White"
android:textSize="15sp"
android:layout_marginTop="5dp"
android:text="Take 100 steps five times within.. "
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Found solution by using custom ImageView.
Its the Best solution. Setting Height same as width in custom ImageView class.
Java code:
public class SquareImageView extends ImageView {
public SquareImageView(Context context) {
super(context);
}
public SquareImageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SquareImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int width = getMeasuredWidth();
setMeasuredDimension(width, width);
}
}
XML code
<com.mypakage.utils.SquareImageView
android:background="#drawable/fitbit"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
I think you can do it with your activity's java code.
Something like this one:
android.view.ViewGroup.LayoutParams mParams = imageView.getLayoutParams();
mParams.height = imageView.getWidth();
imageView.setLayoutParams(mParams);
Make custom ImageView, then set its height same as width.
check this answer
You set ImageView's scaleType as centerInCrop
android:scaleType="centerInCrop"
you can try this just give weights to inner linear layout also
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingBottom="5dp"`enter code here`
android:paddingLeft="5dp"
android:paddingRight="5dp">
<LinearLayout
android:background="#color/colorPrimary"
android:weightSum="10"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_weight="6"
android:id="#+id/startbtn"
android:textStyle="bold"
android:alpha="0.8"
android:textColor="#fff"
android:text="start"
android:layout_centerInParent="true"
android:background="#drawable/common_ic_googleplayservices"
android:layout_width="match_parent"
android:layout_height="150dp"/>
<LinearLayout
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp"
android:orientation="vertical"
android:layout_weight="3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2">
<TextView
android:textColor="#fff"
android:id="#+id/tv_challange_title"
android:textSize="20sp"
android:text="Early-Bird Challange"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<TextView
android:id="#+id/tv_challange_desc"
android:alpha="0.5"
android:textColor="#000"
android:textSize="15sp"
android:layout_marginTop="5dp"
android:text="Take 100 steps five times within.. "
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
use an image with same size on width and height (better .9patch)
<ImageView
android:layout_weight="6"
android:id="#+id/startbtn"
android:textStyle="bold"
android:alpha="0.8"
android:textColor="#fff"
android:text="start"
android:layout_centerInParent="true"
android:layout_width="match_parent"
android:src="#drawable/background_gradient_circular"
android:scaleType="fitCenter"
android:layout_height="match_parent" />
Android introduced a CalendarView back in in API 11. I've implemented it in my app and it seems to work fine in the sense that it displays a perfectly normal-looking whole-month calendar and I can select a date. It triggers the appropriate event and I can read the selected date in my code with no problem.
But I can't advance it out of the current month! The documentation says
A user can select a date by taping on it and can scroll and fling the
calendar to a desired date.
(the "taping" appears in the documentation; I assume it's a typo for "tapping" )
I've tried flinging, swiping, scrolling and nothing happens. Is there something I need to do to enable this feature?
My XML looks like this:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical" >
<!-- This linear layout is because the scrollview can have only 1 direct child -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- Relative layout for Workorder -->
<RelativeLayout
android:id="#+id/rellayWorkorder"
android:background="#383838"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:layout_marginBottom="2dp">
<TextView
android:id="#+id/workorderlabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_margin="2dp"
android:gravity="left"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Work Order:"/>
<TextView
android:id="#+id/workorderContent"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_margin="2dp"
android:gravity="right"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="---workorder---"/>
</RelativeLayout>
<!-- Relative layout for Required Time
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"></FrameLayout> -->
<RelativeLayout
android:id="#+id/rellayRequiredTime"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:layout_marginBottom="2dp">
<TextView
android:id="#+id/requiredTimelabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_margin="2dp"
android:gravity="left"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Required Time:"/>
<TextView
android:id="#+id/requiredTimeContent"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_margin="2dp"
android:gravity="right"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="--- 00 minutes ---"/>
</RelativeLayout>
<!-- Relative layout for Time remaining -->
<RelativeLayout
android:id="#+id/rellayTimeRemaining"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:layout_marginBottom="2dp">
<TextView
android:id="#+id/timeremaininglabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_margin="2dp"
android:gravity="left"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Time Remaining:"/>
<TextView
android:id="#+id/tviewtimeremainingContent"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_margin="2dp"
android:gravity="right"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="--- 0:00:00---"/>
</RelativeLayout>
<!-- Linear layout for Record Start / Record End buttons -->
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<Button
android:id="#+id/debulkrecordStart"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:layout_marginRight="4dp"
android:gravity="center"
android:textAppearance="?android:attr/textAppearanceMedium"
android:onClick="OnSetRecordStartTimeClick"
android:text="Record Start"/>
<Button
android:id="#+id/debulkrecordEnd"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:layout_marginRight="4dp"
android:gravity="center"
android:textAppearance="?android:attr/textAppearanceMedium"
android:onClick="OnSetRecordEndTimeClick"
android:text="Record End"/>
</LinearLayout>
<!-- Relative layout for Vacuum level -->
<RelativeLayout
android:id="#+id/rellayvacuumlevel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp">
<TextView
android:id="#+id/vaclabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_margin="2dp"
android:gravity="left"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Vacuum Level (inches Hg):"/>
<EditText
android:id="#+id/vacleveledit"
android:layout_width="120dp"
android:layout_height="wrap_content"
android:layout_alignParentRight = "true"
android:layout_margin="2dp"
android:gravity="left"
android:textAppearance="?android:attr/textAppearanceSmall"
android:inputType="text|textCapCharacters"
android:text="vac level"
android:layout_marginRight="2dp"
android:layout_marginTop="2dp"
android:layout_marginBottom="2dp"/>
</RelativeLayout>
<!-- Relative layout for Vac Gauge Equipment # -->
<RelativeLayout
android:id="#+id/rlayvacuumGauge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp">
<TextView
android:id="#+id/vacgaugelabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_margin="2dp"
android:gravity="left"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Vac Gauge Equipment #:"/>
<EditText
android:id="#+id/vacgaugeedit"
android:layout_width="120dp"
android:layout_height="wrap_content"
android:layout_alignParentRight = "true"
android:layout_margin="2dp"
android:gravity="left"
android:textAppearance="?android:attr/textAppearanceSmall"
android:inputType="text|textCapCharacters"
android:text="equip. #"/>
</RelativeLayout>
<!-- Relative layout for Calibration Due date -->
<RelativeLayout
android:id="#+id/rlaycalibdue"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp">
<TextView
android:id="#+id/calibduelabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_margin="2dp"
android:gravity="left"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Calibration Due Date:"/>
<EditText
android:id="#+id/calibdueedit"
android:layout_width="120dp"
android:layout_height="wrap_content"
android:layout_alignParentRight = "true"
android:layout_margin="2dp"
android:gravity="left"
android:textAppearance="?android:attr/textAppearanceSmall"
android:inputType="text|textCapCharacters"
android:text="mm/dd/yyyy"/>
</RelativeLayout>
<CalendarView
android:id="#+id/debulkcalendar"
android:layout_width="match_parent"
android:layout_height="240dp"
android:minDate="01/01/2016"
android:maxDate="11/30/2016"
/>
<!-- this linear layout is for the debulk override and done buttons -->
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<Button
android:id="#+id/debulkOverride"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:layout_marginRight="4dp"
android:onClick="OnResetClick"
android:gravity="center"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Override"/>
<Button
android:id="#+id/debulkDone"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:layout_marginRight="2dp"
android:onClick="onDoneBtnClick"
android:gravity="center"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Done"/>
</LinearLayout>
</LinearLayout>
</ScrollView>
Edits:
Sorry for the long XML - in my original posting I just had the CalendarView but someone requested the entire XML.
Also to rule out the possibility that it might be unique to the device I've tested this on my Samsung S5 (Android 5.0) and got the same results.
as per my assumption, it's not scrolling or fling just because of a scrollable parent, can you check it without scroll view?
because I tested it with
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CalendarView
android:id="#+id/debulkcalendar"
android:layout_width="match_parent"
android:layout_height="240dp"
android:minDate="01/01/2016"
android:maxDate="11/30/2016"/>
</LinearLayout>
and its work perfectly
you can use NestedScrollView
NestedScrollView is just like ScrollView, but it supports acting as
both a nested scrolling parent and child on both new and old versions
of Android. Nested scrolling is enabled by default.
#RBK was right, your parentView(ScrollView) interferes with its childView(CalendarView) which makes your CalendarView unscrollable. However, you can create your custom CalendarView which extends the base CalendarView class and override onInterceptTouchEvent method to get what you want.
Create your custom CalendarView class:
public class CalendarViewScrollable extends CalendarView {
public CalendarViewScrollable(Context context) {
super(context);
}
public CalendarViewScrollable(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CalendarViewScrollable(Context context, AttributeSet attrs,
int defStyle) {
super(context, attrs, defStyle);
}
#Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
if (ev.getActionMasked() == MotionEvent.ACTION_DOWN) {
ViewParent p = getParent();
if (p != null)
p.requestDisallowInterceptTouchEvent(true);
}
return false;
}
}
Use it in your XML layout file:
<com.example.app.views.CalendarViewScrollable
android:id="#+id/debulkcalendar"
android:layout_width="match_parent"
android:layout_height="240dp"
android:minDate="01/01/2016"
android:maxDate="11/30/2016" />
Reference from this original answer
I am just a beginner in android, and wish to have your suggestions at places where i could improve my code.
For our project we created a grid view, which loads users at runtime, now the issue with this is it doesnot scroll at times and is very hard to do so.
Also we have used this grid view, making the view visible and gone depending upon the circumstances required by the app.
Here's my xml file:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<!-- Title Layout -->
<RelativeLayout
android:id="#+id/newGroupTitleLayout"
android:layout_width="match_parent"
android:layout_height="50dip"
android:background="#drawable/topbar_bg" >
<ImageButton
android:id="#+id/newGroupCancelButton"
android:layout_width="60dip"
android:layout_height="30dip"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="5dp"
android:background="#drawable/buttonanim_cancel_button"
android:contentDescription="#string/todo" />
<TextView
android:id="#+id/setupPrefTitleTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="#string/new_group"
android:textColor="#color/yellow"
android:textSize="20sp" />
</RelativeLayout>
<!-- Group Name -->
<LinearLayout
android:id="#+id/groupNameLinearLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/newGroupTitleLayout"
android:layout_marginBottom="5dp"
android:layout_marginTop="15dp"
android:orientation="vertical" >
<TextView
android:id="#+id/groupNameTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:text="#string/group_name"
android:textColor="#color/yellow" />
<EditText
android:id="#+id/groupNameEditText"
android:layout_width="match_parent"
android:layout_height="35dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="5dp"
android:background="#drawable/full_textfield"
android:ems="10"
android:inputType="text"
android:nextFocusRight="#+id/stateEditText"
android:paddingLeft="15dp"
android:singleLine="true" >
</EditText>
</LinearLayout>
<RelativeLayout
android:id="#+id/addMemberLayout"
android:layout_width="wrap_content"
android:layout_height="290dp"
android:layout_below="#+id/groupNameLinearLayout"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="10dp"
android:background="#drawable/membersbox" >
<!-- View used when more than 1 member present -->
<GridView
android:id="#+id/mebersListGridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fastScrollAlwaysVisible="true"
android:gravity="center"
android:numColumns="auto_fit"
android:padding="10dp"
android:verticalSpacing="10dp"
android:visibility="gone" />
<!-- View when there are no members -->
<RelativeLayout
android:id="#+id/zeroMembersLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true" >
<ImageButton
android:id="#+id/addMemeberImageButton"
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="70dp"
android:background="#drawable/buttonanim_addmembersmall_button"
android:contentDescription="#string/todo" />
<LinearLayout
android:id="#+id/memberCountStatementTextViewtLayout"
android:layout_width="wrap_content"
android:layout_height="25dp"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/addMemeberImageButton"
android:layout_marginTop="10dp"
android:gravity="center"
android:orientation="horizontal" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/this_group_has_"
android:textColor="#android:color/white"
android:textSize="19sp" />
<TextView
android:id="#+id/groupMembersCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/_0"
android:textColor="#color/yellow"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/_members"
android:textColor="#android:color/white"
android:textSize="19sp" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/memberCountStatementTextViewtLayout"
android:layout_centerHorizontal="true"
android:text="#string/tap_to_add_friends"
android:textColor="#android:color/white"
android:textSize="16sp" />
</RelativeLayout>
</RelativeLayout>
<!-- Create group button -->
<ImageButton
android:id="#+id/creategroupbutton"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_below="#+id/addMemberLayout"
android:layout_marginBottom="15dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="15dp"
android:background="#drawable/buttonanim_creategroup_button"
android:contentDescription="#string/todo" />
</RelativeLayout>
</ScrollView>
Could anyone help me out with this?
Your help is appreciated.
The problem with scrolling is a consequence of putting a GridView inside a ScrollView (which is the root layout in your case). ScrollView allows yout to scroll it's children vertically. GridView scrolls vertically too. So you have to find another solution.
Using GridView has one drawback. It doesn't have header and footer views like ListView has. So might want to replace the GridView with a ListView.
Try to use ExpandableHeightGridView instead of simple gridView:
public class ExpandableHeightGridView extends GridView{
boolean expanded = false;
public ExpandableHeightGridView(Context context)
{
super(context);
}
public ExpandableHeightGridView(Context context, AttributeSet attrs)
{
super(context, attrs);
}
public ExpandableHeightGridView(Context context, AttributeSet attrs,
int defStyle)
{
super(context, attrs, defStyle);
}
public boolean isExpanded()
{
return expanded;
}
#Override
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
// HACK! TAKE THAT ANDROID!
if (isExpanded())
{
// Calculate entire height by providing a very large height hint.
// View.MEASURED_SIZE_MASK represents the largest height possible.
int expandSpec = MeasureSpec.makeMeasureSpec(MEASURED_SIZE_MASK,
MeasureSpec.AT_MOST);
super.onMeasure(widthMeasureSpec, expandSpec);
ViewGroup.LayoutParams params = getLayoutParams();
params.height = getMeasuredHeight();
}
else
{
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
public void setExpanded(boolean expanded)
{
this.expanded = expanded;
}}
<com.your_package_here.ExpandableHeightGridView
android:id="#+id/mebersListGridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fastScrollAlwaysVisible="true"
android:gravity="center"
android:numColumns="auto_fit"
android:padding="10dp"
android:verticalSpacing="10dp"
android:visibility="gone" />
From: this
Can't see your closing ScrollView tag..
</ScrollView>
You should never nest ListView or GridView inside ScrollView because both of these views provide scrolling as soon as your data is more than visible area of the view.
I have simple component - InfoPanel extending LinearLayout with 3 another linear layouts inside. Each of that 3 linear layouts contains 2 textviews.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#F0F"
android:orientation="horizontal"
android:baselineAligned="false" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="0.3"
android:background="#android:color/transparent"
android:gravity="left|center_vertical" >
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#android:color/transparent"
android:gravity="right|center_vertical"
android:text="#string/info_lineM" />
<TextView
android:id="#+id/info_lineM"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#android:color/transparent"
android:gravity="left|center_vertical"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="0.4"
android:gravity="center_horizontal|center_vertical"
android:background="#android:color/transparent">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#android:color/transparent"
android:gravity="right|center_vertical"
android:text="#string/info_lineC" />
<TextView
android:id="#+id/info_lineC"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#android:color/transparent"
android:gravity="left|center_vertical" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="0.3"
android:gravity="right|center_vertical"
android:background="#android:color/transparent">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#android:color/transparent"
android:gravity="right|center_vertical"
android:text="#string/info_lineG" />
<TextView
android:id="#+id/info_lineG"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#android:color/transparent"
android:gravity="left|center_vertical" />
</LinearLayout>
</LinearLayout>
Java class for this component is pretty simple:
public class InfoPanel extends LinearLayout{
public InfoPanel(Context ctx)
{
super(ctx);
LayoutInflater.from(ctx).inflate(R.layout.info_panel, this);
}
public InfoPanel(Context ctx, AttributeSet attr)
{
super(ctx,attr);
LayoutInflater.from(ctx).inflate(R.layout.info_panel, this);
}
#Override
public void onFinishInflate()
{
super.onFinishInflate();
}
}
the main XML where i use that component seems like:
<TableRow
android:id="#+id/tableRow2"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<com.project.my.components.InfoPanel
android:id="#+id/InfoPanel"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</TableRow>
Problem is, that my component have width only something about 10% of width of screen. Right now i am trying to search some same problem (i found much of topics, but nothing worked for me) for more than 5hours..:/ I guess its something really small and stupid what i am missing. Thanks for all idea.
Thats good ,you find the solution of your problem,table row has default behaviour of using properties of first row in all rows.But deleting it solved your problem thats the key thing.