Define maximum RelativeLayout size - android

I have to define 5 layouts on the screen and place them like a 3x3 grid. Layouts is empty.
At some moment I want programmatically to add some view on one layout and that view mustn't grows over allocated size of layout. In other words I want to have layout in which to put any view and it will be guaranty that it won't grows over that layout. Important note: I don't have rights to change manually size of added view, I only can to control its maximum size.
I have right now such layout:
<RelativeLayout
android:id="#+id/pluginsLayout"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/mainButtons"
android:layout_below="#+id/paramsLayout">
<RelativeLayout
android:id="#+id/capturingPluginLayout"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="fill_horizontal|left"
android:layout_above="#+id/processingPluginLayout">
</RelativeLayout>
<RelativeLayout
android:id="#+id/processingPluginLayout"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="fill_horizontal|left"
android:layout_above="#+id/filterPluginLayout">
</RelativeLayout>
<RelativeLayout
android:id="#+id/filterPluginLayout"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="fill_horizontal|left|bottom"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true">
</RelativeLayout>
<RelativeLayout
android:id="#+id/exportPluginLayout"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="fill_horizontal|right"
android:layout_above="#+id/viewfinderPluginLayout">
</RelativeLayout>
<RelativeLayout
android:id="#+id/viewfinderPluginLayout"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="fill_horizontal|bottom|right"
android:layout_toLeftOf="#+id/filterPluginLayout"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true">
</RelativeLayout>
</RelativeLayout>
And I added new view in code:
public void addVFPluginView(View view)
{
((RelativeLayout)MainScreen.thiz.findViewById(R.id.viewfinderPluginLayout)).addView(view);
}
I expect to got like this behaviour:
But I got only this, view fill entire parent layout:
Note: I use API8 (don't have GridLayout)

u can use grid layout in API8.

I've managed to solve this issue.
The main idea was to control view's sizes by myself programmatically.
I calculate appropriate proportion for each zone and when somebody add a new view to some of this layout I check suitability of the size of this view to the allocated size of layout. If size is not suitable I modify LayoutParams for this View.
Here is the xml of empty layouts:
<RelativeLayout
android:id="#+id/pluginsLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/mainButtons"
android:layout_below="#+id/paramsLayout">
<LinearLayout
android:id="#+id/capturePluginLayout"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true">
</LinearLayout>
<LinearLayout
android:id="#+id/processingPluginLayout"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true">
</LinearLayout>
<LinearLayout
android:id="#+id/filterPluginLayout"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true">
</LinearLayout>
<LinearLayout
android:id="#+id/exportPluginLayout"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true">
</LinearLayout>
<RelativeLayout
android:id="#+id/viewfinderPluginLayout"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true">
</RelativeLayout>
</RelativeLayout>
And like that I manage the size of adding views:
public void addVFPluginView(View view)
{
//Get maximum width and height for such plugins
int layoutHeight = this.getViewfinderLayoutHeight();
int layoutWidth = this.getViewfinderLayoutWidth();
//Calculate appropriate size of added plugin's view
android.widget.RelativeLayout.LayoutParams viewLayoutParams = (android.widget.RelativeLayout.LayoutParams)view.getLayoutParams();
viewLayoutParams = this.getTunedRelativeLayoutParams(view, viewLayoutParams, layoutWidth, layoutHeight);
//Get fixed maximum size for this plugin type
public int getViewfinderLayoutWidth()
{
return ((RelativeLayout)MainScreen.thiz.findViewById(R.id.pluginsLayout)).getWidth()/2;
}
public int getViewfinderLayoutHeight()
{
return (int)(((RelativeLayout)MainScreen.thiz.findViewById(R.id.pluginsLayout)).getHeight()*0.7);
}
((RelativeLayout)MainScreen.thiz.findViewById(R.id.viewfinderPluginLayout)).addView(view, viewLayoutParams);
}
android.widget.RelativeLayout.LayoutParams getTunedRelativeLayoutParams(View view, android.widget.RelativeLayout.LayoutParams currParams, int goodWidth, int goodHeight)
{
int viewHeight, viewWidth;
if(currParams != null)
{
viewHeight = currParams.height;
viewWidth = currParams.width;
if(viewHeight > goodHeight || viewHeight <= 0)
viewHeight = goodHeight;
if(viewWidth > goodWidth || viewWidth <= 0)
viewWidth = goodWidth;
currParams.width = viewWidth;
currParams.height = viewHeight;
view.setLayoutParams(currParams);
}
else
{
currParams = new android.widget.RelativeLayout.LayoutParams(goodWidth, goodHeight);
view.setLayoutParams(currParams);
}
return currParams;
}
Finally, next issue is for several views with suitable sizes but in sum they're bigger than allocated size. Maybe I'll just straightly count sizes of views and if the sum with the size of next adding view will be more than allocated size I just disallow to add this view.

Related

Android layout scaling (for elements of a given size in dp)

Three FrameLayout's of different background colors to form a strip.
Each FrameLayout has the size specified in dp.
[
The strip is long and does not fit on the screen.
How to scale the strip to maintain the aspect ratio and without changing the dimensions dp?
[
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:measureAllChildren="true">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layoutDirection="ltr"
android:rotation="0">
<FrameLayout
android:layout_width="200dp"
android:layout_height="42dp"
android:background="#508da6"
/>
<FrameLayout
android:layout_width="400dp"
android:layout_height="42dp"
android:background="#494949"
/>
<FrameLayout
android:layout_width="240dp"
android:layout_height="42dp"
android:background="#ff0000"
/>
</LinearLayout>
</FrameLayout>
There is no need to inflate three whole FrameLayout just for that.View will do just fine. Also you should not give fixed widths since there is no way to make it work for all screen sizes.
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:measureAllChildren="true">
<LinearLayout
android:id="#+id/strip"
android:layout_width="match_parent"
android:layout_height="42dp"
android:layoutDirection="ltr"
android:rotation="0">
<View
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#508da6"
/>
<View
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#494949"
/>
<View
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff0000"
/>
</LinearLayout>
</FrameLayout>
set height on runtime
LinearLayout stripLayout = (LinearLayout)findVieById(R.id.strip);
stripLayout .getViewTreeObserver().addOnGlobalFocusChangeListener(new OnGlobalFocusChangeListener() {
#Override
public void onGlobalFocusChanged(View oldFocus, View newFocus) {
// TODO Auto-generated method stub
int width = stripLayout .getWidth();
int height = //calculate your height//
FrameLayout.LayoutParams params = stripLayout .getLayoutParams();
params.height = height;
stripLayout .setLayoutParams(params);
if (Build.VERSION.SDK_INT < 16) { stripLayout .getViewTreeObserver().removeGlobalOnLayoutListener(this); }
else { stripLayout .getViewTreeObserver().removeOnGlobalLayoutListener(this); }
}
});

Does getMeasuredHeight() and getMeasuredWidth() work on nested views, and when do I use it?

I've been trying to measure the pixel dimensions of a view within a RelativeLayout that's within another RelativeLayout:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="60"
>
...
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/labels_placeholder"
android:id="#+id/player_section_layout"
>
<LinearLayout
android:id="#+id/player_section_background"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="horizontal"
android:weightSum="100">
<!--The view above is what I'm trying to measure-->
<LinearLayout
android:id="#+id/player_section_background_left"
android:layout_height="match_parent"
android:layout_width="0dp"
android:layout_weight="50"
android:background="#AAAAAA"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/player_section_background_right"
android:layout_height="match_parent"
android:layout_width="0dp"
android:layout_weight="50"
android:background="#DD0000"
android:orientation="horizontal" />
</LinearLayout>
<HorizontalScrollView
android:id="#+id/player_section"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_alignTop="#id/player_section_background">
<ImageView
android:id="#+id/waveform_placeholder"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:scaleType="centerInside"
/>
</HorizontalScrollView>
</RelativeLayout>
</RelativeLayout>
I tried calling getMeasuredHeight() and getMeasuredWidth() right after referring to it in onCreateView() of the fragment:
waveformBackground = (LinearLayout)result.findViewById(R.id.player_section_background);
waveformBackground.post(new Runnable() {
#Override
public void run() {
Log.i("bckg_layout_dims", waveformBackground.getMeasuredWidth()+" "+waveformBackground.getMeasuredHeight());
}
});
And it returns 0 for both.
I did hear something about it not working before the view is being drawn, but I don't know when exactly it finishes drawing. Is it after OnCreateView, and if so, can I call it in OnActivityResult?
The problem you are facing is because the view is being drawn after you ask for the height and width. I used a ViewTreeObserver which constantly listens for changes in the views, and can access the measurements after the views has been drawn. Im not sure this is the best solution for your problem but you should look into it. Here's an example:
mTitleContainer.getViewTreeObserver().addOnGlobalLayoutListener(
new ViewTreeObserver.OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
int toolBarHeight = mTitle.getHeight() + mSubtitle.getHeight() + (int) TOOLBARPADDING;
if (toolBarHeight != mLastTitleHeight) {
CollapsingToolbarLayout.LayoutParams layoutParams = (CollapsingToolbarLayout.LayoutParams) mTitleToolbar.getLayoutParams();
layoutParams.height = toolBarHeight;
mTitleToolbar.setLayoutParams(layoutParams);
mLastTitleHeight = toolBarHeight;
}
}
}
);

Making Recyclerview Fixed Height and Scrollable

SOLVED CHECK ANSWER BELOW...
So I am trying to create a comments functionality for my Android app and I want to display the comments inside a recyclerview and then have a button and textview below the recyclerview to add comments. I want to have the recyclerview a certain height and make it scrollable if there are lots of comments because I dont want the users to have to scroll down the screen to find the add button.
I couldn't get it to work so I was wondering if anyone else had that issue.
I have all the adapter and everything set up, I am just having trouble with the recyclerview.
Thanks.
I prob was not clear on what I was trying to accomplish. I am trying to create a cardview where it will display all the comments and the ability to add a new comment. The recyclerview will take up approx 80% of the height and then the last 20% is for the edittext and button.
My XML (Scroll to last cardview where the recyclerview is)
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/scrollview">
<RelativeLayout 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"
tools:context=".ProfilePageActivity"
>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/profilepagetoolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:popupTheme="#style/ThemeOverlay.AppCompat.Light"
android:minHeight="?attr/actionBarSize">
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:layout_marginTop="35dp"
android:layout_below="#+id/profilepagetoolbar"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:id="#+id/aboutCard">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="300dp"
android:gravity="center_vertical"
android:orientation="vertical"
android:layout_alignTop="#+id/aboutCard"
android:focusable="true"
android:focusableInTouchMode="true">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="-60dp"
android:gravity="center_vertical"
android:maxLines="1"
android:textColor="#color/text"
android:textSize="20sp"
android:text="ABOUT" />
<View
android:layout_width="match_parent"
android:layout_height="1px"
android:background="#color/dividers" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="10dp">
<ImageView
android:id="#+id/nameicon"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_margin="8dp"
android:transitionName="appIcon"
android:background="#drawable/ic_account_circle_black_24dp"/>
<TextView
android:id="#+id/Name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="8dp"
android:gravity="center_vertical"
android:maxLines="1"
android:textColor="#color/secondary"
android:textSize="20sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="10dp">
<ImageView
android:id="#+id/locationicon"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_margin="8dp"
android:transitionName="appIcon"
android:background="#drawable/ic_map_black_24dp"/>
<TextView
android:id="#+id/Location"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="11dp"
android:gravity="center_vertical"
android:maxLines="1"
android:textColor="#color/secondary"
android:textSize="15sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="10dp">
<ImageView
android:id="#+id/websiteIcon"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_margin="8dp"
android:transitionName="appIcon"
android:background="#drawable/ic_explore_black_24dp"/>
<TextView
android:id="#+id/Website"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="11dp"
android:gravity="center_vertical"
android:maxLines="1"
android:textColor="#color/secondary"
android:textSize="15sp" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:layout_marginTop="35dp"
android:layout_below="#+id/aboutCard"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:id="#+id/writeComment"
android:layout_alignParentTop="false"
android:layout_alignParentBottom="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="300dp"
android:gravity="center_vertical"
android:orientation="vertical"
android:focusable="true"
android:focusableInTouchMode="true">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="-100dp"
android:gravity="center_vertical"
android:maxLines="1"
android:textColor="#color/text"
android:textSize="20sp"
android:text="Comments" />
<View
android:layout_width="match_parent"
android:layout_height="1px"
android:background="#color/dividers"
android:id="#+id/divider"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="1">
<EditText
android:layout_width="244dp"
android:layout_height="wrap_content"
android:id="#+id/editComment"
android:layout_below="#+id/divider"
android:textColor="#color/text"
android:hint="Write a comment..."/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Create"
android:id="#+id/btnComment"
android:layout_gravity="center_horizontal" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:layout_marginTop="20dp"
android:layout_below="#+id/writeComment"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:id="#+id/commentsCard">
<LinearLayout
android:layout_alignParentTop="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="0dp"
android:gravity="center_vertical"
android:maxLines="1"
android:textColor="#color/text"
android:textSize="20sp"
android:text="Comments" />
<android.support.v7.widget.RecyclerView
android:id="#+id/commentsList"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusableInTouchMode="true" />
</LinearLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
</ScrollView>
The second and first comment are being cut off.
So what my problem was that for some reason, Recyclerview didnt wrap_contents. I did some research (thanks stackoverflow) and found out a lot of people were having this issue and they posted solutions for this issue.
Basically, I had to use a customized linearlayoutmanger to fix the issue.
I will post the solution they posted and links to their questions. thanks for whoever tried to help, I appreciate it.
This is the extra file I needed. And then I had to set my recyclerview to use this layout instead of the default one.
public class MyLinearLayoutManager extends LinearLayoutManager {
public MyLinearLayoutManager(Context context, int orientation, boolean reverseLayout) {
super(context, orientation, reverseLayout);
}
private int[] mMeasuredDimension = new int[2];
#Override
public void onMeasure(RecyclerView.Recycler recycler, RecyclerView.State state,
int widthSpec, int heightSpec) {
final int widthMode = View.MeasureSpec.getMode(widthSpec);
final int heightMode = View.MeasureSpec.getMode(heightSpec);
final int widthSize = View.MeasureSpec.getSize(widthSpec);
final int heightSize = View.MeasureSpec.getSize(heightSpec);
int width = 0;
int height = 0;
for (int i = 0; i < getItemCount(); i++) {
measureScrapChild(recycler, i,
View.MeasureSpec.makeMeasureSpec(i, View.MeasureSpec.UNSPECIFIED),
View.MeasureSpec.makeMeasureSpec(i, View.MeasureSpec.UNSPECIFIED),
mMeasuredDimension);
if (getOrientation() == HORIZONTAL) {
width = width + mMeasuredDimension[0];
if (i == 0) {
height = mMeasuredDimension[1];
}
} else {
height = height + mMeasuredDimension[1];
if (i == 0) {
width = mMeasuredDimension[0];
}
}
}
switch (widthMode) {
case View.MeasureSpec.EXACTLY:
width = widthSize;
case View.MeasureSpec.AT_MOST:
case View.MeasureSpec.UNSPECIFIED:
}
switch (heightMode) {
case View.MeasureSpec.EXACTLY:
height = heightSize;
case View.MeasureSpec.AT_MOST:
case View.MeasureSpec.UNSPECIFIED:
}
setMeasuredDimension(width, height);
}
private void measureScrapChild(RecyclerView.Recycler recycler, int position, int widthSpec,
int heightSpec, int[] measuredDimension) {
View view = recycler.getViewForPosition(position);
if (view != null) {
RecyclerView.LayoutParams p = (RecyclerView.LayoutParams) view.getLayoutParams();
int childWidthSpec = ViewGroup.getChildMeasureSpec(widthSpec,
getPaddingLeft() + getPaddingRight(), p.width);
int childHeightSpec = ViewGroup.getChildMeasureSpec(heightSpec,
getPaddingTop() + getPaddingBottom(), p.height);
view.measure(childWidthSpec, childHeightSpec);
measuredDimension[0] = view.getMeasuredWidth() + p.leftMargin + p.rightMargin;
measuredDimension[1] = view.getMeasuredHeight() + p.bottomMargin + p.topMargin;
recycler.recycleView(view);
}
}
}
After that. Change this:
mProductsRecyclerView.setLayoutManager(new LinearLayoutManager(getApplicationContext()));
To this:
mRecyclerView.setLayoutManager(new MyLinearLayoutManager(getApplicationContext(),1,false));
Three new paramets(Context, int Orientation, boolean reverse);
basically, i put 1 for orientation so it shows vertiacally, and false for revers so it shows up how it is ordered in my List.
Links to other people's question with same problem as me.
Nested Recycler view height doesn't wrap its content
Nested Recycler view height doesn't wrap its content
Thanks once again guys. Hope this helps someone else
Add this code in your activity, will set the height of your recycler view to the 90% of user's screen window.
DisplayMetrics displaymetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
int a = (displaymetrics.heightPixels*90)/100;
recylcerView.getLayoutParams().height =a;
and your comment layout below the your recyclerView
like this
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_alignParentTop="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/mudit"
>
<android.support.v7.widget.RecyclerView
android:id="#+id/my_recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="5dp"
android:scrollbars="vertical" />
</LinearLayout>
<RelativeLayout
android:layout_below="#+id/mudit"
android:id="#+id/rl_commentWrap"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
<EditText
android:id="#+id/editText1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:ems="10" />
<Button
android:id="#+id/plusButton"
style="android:buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="Send"
android:textColor="#FFFFFF"
android:translationZ="5dp" />
</RelativeLayout>
</RelativeLayout>
In my situation I had a DialogFragment, in which there are 2 recyclers and 2 horizontal linear layouts with 2 buttons.
Dialog from top to bottom looks like this:
RecyclerView A
Horizontal linear layout X with 2 buttons
RecyclerView B
Horizontal linear layout Y with 2 buttons
On top of that both recyclers size is dynamic.
Recycler A size can change based on user swipes in both recyclers.
Recycler B size can change based on its item click listener.
What I wanted to achieve was to cut the Dialog from top to bottom
and have each of those four views its constant part of the Dialog height.
What worked was to divide it first to 2 separate relative layouts, say lTOP and lBottom. Set lTOP alignParentTop, lBottom alignParentBottom and layout_below lTOP.
Both of them width match_parent, height wrap_content.
Then in each of them create 1 relative (say lINTop) and 1 linear (say lINBottom) layouts. lINTop has recycler, lINBottom has 2 buttons.
Set both lINTop lINBottom width match_parent, height wrap_content.
Set lINTop alignParentTop, lINBottom alignParentBottom and below lINTop.
Set lINTop orientation vertical, lINBottom orientation horizontal.
Set recyclers width match_parent, height wrap_content.
Then i putted this all inside single relative layout with width/height wrap_content and orientation vertical.
Then this inside scrollview with width/height match_parent and orientation vertical.
Then needed a little code magic for setting up recycler in onCreateView:
For Recycler A:
private void setupRecyclerA() {
// use a linear layout manager
RecyclerView.LayoutManager layManUS = new LinearLayoutManager(setupActivity().get());
recyclerA.setLayoutManager(layManUS);
recyclerA.addItemDecoration(new DividerItemDecoration(
setupActivity().get(), LinearLayoutManager.VERTICAL));
recyclerA.setNestedScrollingEnabled(true);
// use this setting to improve performance if you know that changes
// in content do not change the layout size of the RecyclerView
recyclerA.setHasFixedSize(true);
}
For Recycler B:
private void setupRecyclerB() {
// use a linear layout manager
RecyclerView.LayoutManager layManUS = new LinearLayoutManager(setupActivity().get());
recyclerB.setLayoutManager(layManUS);
recyclerB.addItemDecoration(new DividerItemDecoration(
setupActivity().get(), LinearLayoutManager.VERTICAL));
recyclerB.setNestedScrollingEnabled(true);
// set fixed height
DisplayMetrics displaymetrics = new DisplayMetrics();
setupActivity().get().getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
// set height to 30 percent of dialog
int a = (displaymetrics.heightPixels*30)/100;
recyclerB.getLayoutParams().height =a;
// use this setting to improve performance if you know that changes
// in content do not change the layout size of the RecyclerView
recyclerB.setHasFixedSize(true);
}
I didnt invented it, I just combined solutions from many different Stack Overflow questions which I dont even remember now, sorry and thanks to the Creators.
I had a similar problem and solved it with RelativeLayout. I have this layout:
I wanted the top and bottom cardview to stay in place while scrolling the central recyclerView. Tried with LinearLayout and ConstraintLayout but didn't work, the bottom CardView only was shown when I scrolled to the end of the recycler.
This is my code, notice the layout_above, layout_below, and layout_alignParentBottom attributes:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/grisMasOscuro">
<androidx.cardview.widget.CardView
android:id="#+id/cv1"
android:layout_width="match_parent"
android:layout_height="50dp" >
<!-- cardview content -->
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/cv3"
android:layout_below="#id/cv1">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/myRecyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/cv3"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_alignParentBottom="true">
<!-- cardview content -->
</androidx.cardview.widget.CardView>
</RelativeLayout>
I found another solution.
If you will wrap recyclerview in RelativeLayout, it will solve the problem easily.
Thanks.

How write text on image in RelativeLayout while it always keeps the same position (even if image is resized)?

As the title says. I need to write some text at ImageView. For that I was advised to use RelativeLayout. BUT there is not possible to use alignParentBottom (or maybe it is but I cant use margin then).
Problem is: I need to keep text at exactly some part of image even though it is resized or it is shown on different screen resolution etc. Is that possible?
CODE:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#FFFFFF"
android:gravity="center" >
<!-- Speaker image -->
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:adjustViewBounds="true"
android:background="#ffffff"
android:src="#drawable/authorimg" />
<!-- Time -->
<TextView
android:id="#+id/timeTVid"
style="#style/TextWithShadow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="50dp"
android:text="2:59" />
</RelativeLayout>
I want the TextView to be somewhere in the middle but not exactly there.
EDIT: After first response tried (not working):
Horizontal position http://i59.tinypic.com/o76omg.png
Vertical position http://i59.tinypic.com/20tf7ky.png
I want to have "Your text" to be at the same position at the picture.
I found out that this is the solution. It's a shame that XML in android does not support percentage padding/margin so you have to do it programmatically as shown below. I just got the image width, width of frame and calculated it so the text is always on the same place on the image.
#Override
public void onWindowFocusChanged(boolean hasFocus) {
super.onWindowFocusChanged(hasFocus);
int paddingLeft;
frameHeight = imgFrameLayout.getHeight();
frameWidth = imgFrameLayout.getWidth();
imgWidth = image.getWidth();
imgHeight = image.getHeight();
// getting the difference of img width and frame width
int diff = frameWidth - imgWidth;
// if frame is bigger than image then set additional value to padding
// 20% image width + (diff/2)
if (diff > 0) {
paddingLeft = imgWidth / 100 * 20 + diff / 2;
}
// else set padding 20% of the image
else {
paddingLeft = imgWidth / 100 * 20;
}
timeTV.setPadding(paddingLeft, 0, 0, 0);
}
Use this example but it will only work for the Relativelayout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical" >
<ImageView android:id="#+id/full_image_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
<TextView
android:id="#+id/myImageViewText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/myImageView"
android:layout_alignTop="#+id/myImageView"
android:layout_alignRight="#+id/myImageView"
android:layout_alignBottom="#+id/myImageView"
android:layout_margin="1dp"
android:gravity="center"
android:text="Your Text"
android:textColor="#000000" />
Might want to try using a FrameLayout. In any event, set textview to match_parent (both ways)
use android:gravity="center" (not layout_gravity). now if you want to adjust the centered position to make it offset a bit, you can use paddingLeft, paddingTop, etc to adjust your center.
I think you should create two separate xml files. the first one for the image and 2nd one for the overlayed text. then in your activity class you should use LayoutInflater. I created an example and I hope it is what you are looking for.
JavaCode:
private ImageView imgView;
private TextView tv00, tv01, tv02, tv03;
private LayoutInflater mInflater = null;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_image_overlayed_with_text00);
imgView = (ImageView) findViewById(R.id.imgview);
tv00 = (TextView) findViewById(R.id.tv00);
tv01 = (TextView) findViewById(R.id.tv01);
tv02 = (TextView) findViewById(R.id.tv02);
tv03 = (TextView) findViewById(R.id.tv03);
//imgView.setImageBitmap(BitmapFactory.decodeFile("c:\\pic.jpg"));
imgView.setImageResource(R.drawable.pic);
mInflater = LayoutInflater.from(getApplicationContext());
View overView = mInflater.inflate(R.layout.textoverlay, null);
addContentView(overView, new LayoutParams(LayoutParams.MATCH_PARENT,
LayoutParams.MATCH_PARENT));
ImageviewXML:
<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.imageoverlayedwithtext00.ImageOverlayedWithText00$PlaceholderFragment" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/imgview" />
TextOverlayXML:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center_horizontal">
<TextView
android:id="#+id/tv00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="50sp"
android:text="text0"/>
<TextView
android:id="#+id/tv01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="50sp"
android:text="text1"/>
<TextView
android:id="#+id/tv02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="50sp"
android:text="text2"/>
<TextView
android:id="#+id/tv03"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="50sp"
android:text="text3"/>
</LinearLayout>

Textview with long text pushes out other views in GridLayout despite ellipsize=end

My problem is very similar to How to get a layout where one text can grow and ellipsize, but not gobble up the other elements on the layout, but read on below why I can't use TableLayouts as proposed there.
I'm trying to create a listview row that basically looks like this:
| TextView | View 1 | View 2 |
All views contain variable width elements. The TextView has ellipsize="end" set. View 1 should align left of the TextView, while View 2 should align to the right of the screen. So, normally, there would be whitespace between View 1 and View 2. As the text in the TextView grows longer, the TextView should grow, pushing View 1 to the right until there is no more whitespace left. Then, ellipsize should kick in, cutting of the text in TextView and appending an ellipsis ("...") at the end.
So, the result should look something like this:
+----------------------------------------+
| short text [view1] [view2] |
+----------------------------------------+
| long text with ell ... [view1] [view2] |
+----------------------------------------+
I've tried:
TableLayouts, but they seem to make scrolling extremely slow on some devices.
RelativeLayouts, but I either had overlapping views, or view1 or view2 disappeared completely.
GridLayouts, but the TextView always grows until it takes up the whole width of the screen, thus pushing view1 and view2 out of the screen.
This is the GridLayout I tried:
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_gravity="left|fill_horizontal"
android:ellipsize="end"
android:singleLine="true"
android:text="Long text to demonstrate problem with TextView in GridLayout taking up too much space despite ellipsis" />
<TextView
android:layout_gravity="left"
android:text="(view1)" />
<TextView
android:layout_gravity="right"
android:text="(view2)" />
</GridLayout>
View 1 and View 2 are not really TextViews, I just used them in the example to simplify things.
Is there any way to achieve this without using TableLayouts?
EDIT:
As requested, here is my attempt at solving this with a RelativeLayout. The TextView takes up the full width of the screen in this case, so neither view1 nor view2 are visible.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/rl0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:ellipsize="end"
android:singleLine="true"
android:text="Long text to demonstrate problem with TextView in GridLayout taking up too much space despite ellipsis" />
<TextView
android:id="#+id/rl1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/rl0"
android:layout_marginLeft="10dp"
android:text="(view1)" />
<TextView
android:id="#+id/rl2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/rl1"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dp"
android:text="(view2)" />
</RelativeLayout>
I seem to have found a potential solution to prevent a TextView in GridLayout from growing unboundedly and pushing out other views. Not sure if this has been documented before.
You need to use fill layout_gravity and set an arbitrary layout_width or width on the long TextView in need of ellipsizing.
android:layout_gravity="fill"
android:layout_width="1dp"
Works for both GridLayout and android.support.v7.widget.GridLayout
I'm a big fan of LinearLayouts, so here's my suggestion using those:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="1" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ellipsize="end"
android:singleLine="true"
android:text="Long text to demonstrate problem with TextView in GridLayout taking up too much space despite ellipsis" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="(view1)" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:text="(view2)" />
</LinearLayout>
I will suggest you to play with layout_weight property of your widget
Example:
<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"
tools:context=".MainActivity" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="10">
<LinearLayout
android:id="#+id/ll_twoViewContainer"
android:layout_weight="8"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/rl0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_weight="1"
android:ellipsize="end"
android:singleLine="true"
android:text="Long text" />
<TextView
android:id="#+id/rl1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_toRightOf="#id/rl0"
android:layout_weight="1"
android:minWidth="120dp"
android:text="(view1)" />
</LinearLayout>
<TextView
android:id="#+id/rl2"
android:layout_weight="2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/rl1"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dp"
android:text="(view2)" />
</LinearLayout>
</LinearLayout>
finally your layout will look like as follow:
+----------------------------------------+
| short text [view1] [view2] |
+----------------------------------------+
| long text with ell ... [view1] [view2] |
+----------------------------------------+
I think you should create custom layout for your purpose. I don't know how to do this using only default layouts/view and make it work for all cases.
The trick which worked for me was to use maxWidth to restrict the width of the first view. You need to do it with Java, here is the basic logic:
firstView.setMaxWidth(parentView.getWidth() - view2.getWidth() - view1.getWidth() - padding * 2);
Not pretty, but it works.
I think there's just a small issue on the layout that could be solved, anchoring the view3 to the right and start from there to force the view to have a delimited area (hence being able to properly set the ellipse):
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/rl3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="(view2)" />
<TextView
android:id="#+id/rl2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/rl3"
android:text="(view1)" />
<TextView
android:id="#+id/rl1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:singleLine="true"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#id/rl2"
android:text="Long text to demonstrate problem with TextView in GridLayout taking up too much space despite ellipsis" />
</RelativeLayout>
Hope this helps...
Regards!
Try this
<?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:baselineAligned="false"
android:orientation="horizontal">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:singleLine="true"
android:text="Long text to demonstrate problem with TextView in GridLayout taking up too much space despite ellipsis"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:text="(view1)"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:text="(view2)"/>
</LinearLayout>
</LinearLayout>
Currently, all views are centered. You can change android:gravity property to meet your needs. For example, you may want to align view1 right and view2 left in which case last two LinearLayouts would look something like (with 5dp margin on the right and left respectively):
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center|right">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginRight="5dp"
android:text="(view1)"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center|left">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_marginLeft="5dp"
android:text="(view2)"/>
</LinearLayout>
I find my solution for the case number 2 (the one with a long text):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="3" >
<TextView
android:id="#+id/rl0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="3"
android:ellipsize="end"
android:singleLine="true"
android:text="Long text to demonstrate problem with TextView in GridLayout taking up too much space despite ellipsis" />
<TextView
android:id="#+id/rl1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:text="(view1)" />
<TextView
android:id="#+id/rl2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:text="(view2)" />
</LinearLayout>
The real problem is case one, and i didn't try a lot of things for this. I hope it helps (and if i have more spare time, i will try to achieve first one!).
If the views on the right get pushed over by the text by design, you might as well use a ListView instead of a GridView.
You would just need to make the base of the list item layout a RelativeLayout, and set rules like this:
You can set the two views on the right to alignParentRight (using android:layout_alignParentLeft="true"), but make sure the first view stays to the left of the second so it will push itself to the left as the views stretch out.
You can make the TextView on the left align to the left, but stay to the left of the first view (using android:layout_toLeftOf="#+id/viewId") so it won't overlap with the views.
Try using Layout Weight
<TableRow
android:id="#+id/tableRow3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/tableRow2"
android:layout_alignParentBottom="true"
android:gravity="center"
android:weightSum="10"
android:background="#android:color/black" >
<TextView
android:id="#+id/txtInningsTotal"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:gravity="center"
android:text="0"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/txtTeamOneTotal"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2.5"
android:gravity="center"
android:text="0"
android:textColor="#android:color/white" />
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.2" />
<TextView
android:id="#+id/txtTeamTwoTotal"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2.5"
android:gravity="center"
android:text="0"
android:textColor="#android:color/white" />
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.2" />
<TextView
android:id="#+id/txtGrandTotal"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:gravity="center"
android:text="0"
android:textColor="#android:color/white" />
</TableRow>
Here i have taken table row in which there is layout weight sum which is of 10 means that it is 100% width of its parent. and in all its child views i have set width to 0Dp and given weight to 1 or 2. so that it will take up to that percent of total 10. so the layout will be adjusted accordingly screen and also there will be no issue of overlapping.
If i have understood you correctly then this is the answer you wanted.
Hope it Helps!
First, you must layout [view 2] to parent Right;
Again, you reference the reference to the last two layout!
<Relativelayout android:layout_width="match_parent"
android:layout_height="wrap_content"
<TextView
android:id="#+id/view2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toLeft="#id/view2"
android:gravity="left">
<TextView
android:id="#+id/shortORlongtTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/view1"
android:ellipsize="end"
android:maxLines="1"
android:textSize="18dp"/>
<TextView
android:id="#+id/view1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
/>
</RelativeLayout>
I had the same problem with the grid layout. what i did is given a fixed width for the text view and also given layout_columnWeight property for each text view then the issue was fixed ,hope it helps ...
<TextView
android:id="#+id/txtName"
style="#style/MyDetailTitle"
android:layout_width="#dimen/detail_length"
android:layout_height="wrap_content"
android:text="#string/app_name"
app:layout_column="3"
app:layout_columnWeight="1"
app:layout_gravity="start"
app:layout_row="1" />
GridLayout is like the other things on Android : flawed by design.
You will need a custom Layout, the following example will allow you to layout things like:
[ label | short text | very long label | short text ]
[ long label | very very very | label | very long text ]
[ | long text | | ]
import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import java.util.ArrayList;
import java.util.List;
public class TwoColumsGridLayout extends ViewGroup {
private final List<List<View>> rows;
private int rowCount = 0;
private int firstColumWidth;
private int secondColumWidth;
private int thirdColumWidth;
private int fourthColumnWidth;
private final List<Integer> rowHeights = new ArrayList<>();
private final List<List<Integer>> cellHeights = new ArrayList<>();
private final List<Integer> firstCellsWidths = new ArrayList<>(4);
private final List<Integer> thirdCellsWidths = new ArrayList<>(4);
public TwoColumsGridLayout(Context context, int rowCount) {
super(context);
rows = new ArrayList<>(rowCount);
}
public void add(Context ctx, TextView l1, View t1, TextView l2, View t2) {
final List<View> row = new ArrayList<>(4);
row.add(l1);
row.add(t1);
row.add(l2);
row.add(t2);
rows.add(row);
this.addView(l1);
this.addView(t1);
if (l2 != null)
this.addView(l2);
if (t2 != null)
this.addView(t2);
this.rowCount++;
}
public int getRowCount() {
return rowCount;
}
#Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
int curLeft = 0;
int curBottom;
int curRight;
int curTop = 0;
int i = 0;
for (List<View> row : rows) {
final int rowHeight = this.rowHeights.get(i);
final List<Integer> rowCellHeights = this.cellHeights.get(i);
final View v0 = row.get(0);
curLeft = 0;
curRight = curLeft + this.firstColumWidth;
if (v0 != null) {
curBottom = curTop + rowCellHeights.get(0);
// Right align
v0.layout(curLeft + this.firstColumWidth - this.firstCellsWidths.get(i), curTop + 7, curRight, curBottom + 7);
}
//
final View v1 = row.get(1);
curLeft += this.firstColumWidth;
curRight = curLeft + this.secondColumWidth;
if (v1 != null) {
curBottom = curTop + rowCellHeights.get(1);
v1.layout(curLeft, curTop, curRight, curBottom);
}
//
final View v2 = row.get(2);
curLeft += this.secondColumWidth;
curRight = curLeft + this.thirdColumWidth;
if (v2 != null) {
curBottom = curTop + rowCellHeights.get(2);
// Right align
v2.layout(curLeft + this.thirdColumWidth - this.thirdCellsWidths.get(i), curTop + 7, curRight, curBottom + 7);
}
//
final View v3 = row.get(3);
curLeft += this.thirdColumWidth;
curRight = curLeft + this.fourthColumnWidth;
if (v3 != null) {
curBottom = curTop + rowCellHeights.get(3);
v3.layout(curLeft, curTop, curRight, curBottom);
}
curTop += rowHeight;
i++;
}
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
final int parentWidth = MeasureSpec.getSize(widthMeasureSpec);
// Compute first column width
firstColumWidth = 0;
for (List<View> row : rows) {
final View v = row.get(0);
if (v != null) {
v.setLayoutParams(new ViewGroup.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
measureChild(v, widthMeasureSpec, heightMeasureSpec);
final int w = v.getMeasuredWidth();
if (firstColumWidth < w) {
firstColumWidth = w;
}
}
}
// Compute third column width
thirdColumWidth = 0;
for (List<View> row : rows) {
final View v = row.get(2);
if (v != null) {
v.setLayoutParams(new ViewGroup.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
measureChild(v, widthMeasureSpec, heightMeasureSpec);
final int w = v.getMeasuredWidth();
if (thirdColumWidth < w) {
thirdColumWidth = w;
}
}
}
secondColumWidth = (parentWidth - firstColumWidth - thirdColumWidth) / 2;
fourthColumnWidth = parentWidth - firstColumWidth - secondColumWidth - thirdColumWidth;
// Clear
this.rowHeights.clear();
this.cellHeights.clear();
this.firstCellsWidths.clear();
this.thirdCellsWidths.clear();
// Compute heights
int height = 0;
for (List<View> row : rows) {
final ArrayList<Integer> rowCellHeights = new ArrayList<>(4);
cellHeights.add(rowCellHeights);
int rowHeight = 0;
// First column
final View v0 = row.get(0);
if (v0 != null) {
int h = v0.getMeasuredHeight();
this.firstCellsWidths.add(v0.getMeasuredWidth());
rowCellHeights.add(h);
if (rowHeight < h) {
rowHeight = h;
}
} else {
this.firstCellsWidths.add(0);
}
// Second column
final View v1 = row.get(1);
if (v1 != null) {
v1.setLayoutParams(new ViewGroup.LayoutParams(secondColumWidth, LayoutParams.WRAP_CONTENT));
measureChild(v1, widthMeasureSpec, heightMeasureSpec);
int h = v1.getMeasuredHeight();
rowCellHeights.add(h);
if (rowHeight < h) {
rowHeight = h;
}
}
// Third column
final View v2 = row.get(2);
if (v2 != null) {
int h = v2.getMeasuredHeight();
this.thirdCellsWidths.add(v2.getMeasuredWidth());
rowCellHeights.add(h);
if (rowHeight < h) {
rowHeight = h;
}
} else {
this.thirdCellsWidths.add(0);
}
// Fourth column
final View v3 = row.get(3);
if (v3 != null) {
v3.setLayoutParams(new ViewGroup.LayoutParams(fourthColumnWidth, LayoutParams.WRAP_CONTENT));
measureChild(v3, widthMeasureSpec, heightMeasureSpec);
int h = v3.getMeasuredHeight();
rowCellHeights.add(h);
if (rowHeight < h) {
rowHeight = h;
}
}
height += rowHeight;
this.rowHeights.add(rowHeight);
}
setMeasuredDimension(parentWidth, height);
}
}
Have fun.
TableLayout will give expected behavior. May cause performance issue as question's author mention, but works great with simple layout. If the row is repeatable and scrollable, consider use gridview instead
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:stretchColumns="1"
android:shrinkColumns="0"
>
<TableRow>
<TextView/>
<View1/>
<View2/>
</TableRow>
</TableLayout>

Categories

Resources