How can I size columns in a gridlayout?

I'm building a GridLayout.
I have 8 columns.
I want the first TextView to span 6 cols and display the text on 2 lines.
I want the next TextView to span 1 col and to display a Number from 1 to 10.
Finally the next TextView display the following text "/10"

So far I've achieved what I want, but not so much with the alignments.

Code:

<GridLayout 

xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent" 

android:layout_height="fill_parent" 

android:columnCount="7" 

android:orientation="horizontal"

android:rowCount="8">

    <TextView

        android:minLines="2"

        android:gravity="center_vertical"

        android:layout_row="1"

        android:layout_columnSpan="5"

        android:layout_columnWeight="4"



        android:layout_gravity="fill_horizontal"

        android:id="@+id/qol1"

        android:text="Avoir du temps pour moi" />

    <TextView

        android:layout_columnSpan="1"

        android:layout_gravity="fill_horizontal"

        android:id="@+id/score_qol1"

        android:text="6"

        style="@android:style/TextAppearance.DeviceDefault.Large"

        android:gravity="right" />

    <TextView

        android:layout_columnSpan="1"

        android:layout_gravity="fill_horizontal"

        android:id="@+id/score_qol1_10"

        android:text="/10"

        android:gravity="right" />

</GridLayout>

The result is the following:

enter image description here

As you can Imagine, I'd like the last cell to wrap its content, the middle one to be aligned on the left and the first cell to take all the space available, according to the mockup I have:

enter image description here

I know that the last 2 cells will always take approximately the same space. I don't wan't to use fixed sizes because of the diversity of screen resolutions.

I thought that layout_columnWeight would be the solution, but it does not work.

edited Nov 21 '18 at 12:28

Aniruddh Parihar

2,18911027

asked Nov 21 '18 at 12:27

Olivier MATROT

1,31121941

1

have you tried looking into constraint layout, it is advanced has more features codelabs.developers.google.com/codelabs/constraint-layout/…

– Karan Mer
Nov 21 '18 at 12:36

I was unsure it would be available with Xamarin.Android, but it is. Will do.

– Olivier MATROT
Nov 21 '18 at 13:10

I guess you choose a GridLayout thinking it would be easier to build the layout. But your layout is so simple that it becomes hard. You could achieve this by using ConstraintLayout or LinearLayoutsetting weight attibute in each view.

– Giovanne
Nov 21 '18 at 13:28

1

@Giovanne I ended up using a LinearLayout inside a row of the GridLayout and this is working fine.

– Olivier MATROT
Nov 22 '18 at 12:56

add a comment |

So far I've achieved what I want, but not so much with the alignments.

Code:

<GridLayout 

xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent" 

android:layout_height="fill_parent" 

android:columnCount="7" 

android:orientation="horizontal"

android:rowCount="8">

    <TextView

        android:minLines="2"

        android:gravity="center_vertical"

        android:layout_row="1"

        android:layout_columnSpan="5"

        android:layout_columnWeight="4"



        android:layout_gravity="fill_horizontal"

        android:id="@+id/qol1"

        android:text="Avoir du temps pour moi" />

    <TextView

        android:layout_columnSpan="1"

        android:layout_gravity="fill_horizontal"

        android:id="@+id/score_qol1"

        android:text="6"

        style="@android:style/TextAppearance.DeviceDefault.Large"

        android:gravity="right" />

    <TextView

        android:layout_columnSpan="1"

        android:layout_gravity="fill_horizontal"

        android:id="@+id/score_qol1_10"

        android:text="/10"

        android:gravity="right" />

</GridLayout>

The result is the following:

enter image description here

As you can Imagine, I'd like the last cell to wrap its content, the middle one to be aligned on the left and the first cell to take all the space available, according to the mockup I have:

enter image description here

I know that the last 2 cells will always take approximately the same space. I don't wan't to use fixed sizes because of the diversity of screen resolutions.

I thought that layout_columnWeight would be the solution, but it does not work.

edited Nov 21 '18 at 12:28

Aniruddh Parihar

2,18911027

asked Nov 21 '18 at 12:27

Olivier MATROT

1,31121941

1

have you tried looking into constraint layout, it is advanced has more features codelabs.developers.google.com/codelabs/constraint-layout/…

– Karan Mer
Nov 21 '18 at 12:36

I was unsure it would be available with Xamarin.Android, but it is. Will do.

– Olivier MATROT
Nov 21 '18 at 13:10

I guess you choose a GridLayout thinking it would be easier to build the layout. But your layout is so simple that it becomes hard. You could achieve this by using ConstraintLayout or LinearLayoutsetting weight attibute in each view.

– Giovanne
Nov 21 '18 at 13:28

1

@Giovanne I ended up using a LinearLayout inside a row of the GridLayout and this is working fine.

– Olivier MATROT
Nov 22 '18 at 12:56

add a comment |

So far I've achieved what I want, but not so much with the alignments.

Code:

<GridLayout 

xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent" 

android:layout_height="fill_parent" 

android:columnCount="7" 

android:orientation="horizontal"

android:rowCount="8">

    <TextView

        android:minLines="2"

        android:gravity="center_vertical"

        android:layout_row="1"

        android:layout_columnSpan="5"

        android:layout_columnWeight="4"



        android:layout_gravity="fill_horizontal"

        android:id="@+id/qol1"

        android:text="Avoir du temps pour moi" />

    <TextView

        android:layout_columnSpan="1"

        android:layout_gravity="fill_horizontal"

        android:id="@+id/score_qol1"

        android:text="6"

        style="@android:style/TextAppearance.DeviceDefault.Large"

        android:gravity="right" />

    <TextView

        android:layout_columnSpan="1"

        android:layout_gravity="fill_horizontal"

        android:id="@+id/score_qol1_10"

        android:text="/10"

        android:gravity="right" />

</GridLayout>

The result is the following:

enter image description here

As you can Imagine, I'd like the last cell to wrap its content, the middle one to be aligned on the left and the first cell to take all the space available, according to the mockup I have:

enter image description here

I know that the last 2 cells will always take approximately the same space. I don't wan't to use fixed sizes because of the diversity of screen resolutions.

I thought that layout_columnWeight would be the solution, but it does not work.

edited Nov 21 '18 at 12:28

Aniruddh Parihar

2,18911027

asked Nov 21 '18 at 12:27

Olivier MATROT

1,31121941

So far I've achieved what I want, but not so much with the alignments.

Code:

<GridLayout 

xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent" 

android:layout_height="fill_parent" 

android:columnCount="7" 

android:orientation="horizontal"

android:rowCount="8">

    <TextView

        android:minLines="2"

        android:gravity="center_vertical"

        android:layout_row="1"

        android:layout_columnSpan="5"

        android:layout_columnWeight="4"



        android:layout_gravity="fill_horizontal"

        android:id="@+id/qol1"

        android:text="Avoir du temps pour moi" />

    <TextView

        android:layout_columnSpan="1"

        android:layout_gravity="fill_horizontal"

        android:id="@+id/score_qol1"

        android:text="6"

        style="@android:style/TextAppearance.DeviceDefault.Large"

        android:gravity="right" />

    <TextView

        android:layout_columnSpan="1"

        android:layout_gravity="fill_horizontal"

        android:id="@+id/score_qol1_10"

        android:text="/10"

        android:gravity="right" />

</GridLayout>

The result is the following:

enter image description here

As you can Imagine, I'd like the last cell to wrap its content, the middle one to be aligned on the left and the first cell to take all the space available, according to the mockup I have:

enter image description here

I know that the last 2 cells will always take approximately the same space. I don't wan't to use fixed sizes because of the diversity of screen resolutions.

I thought that layout_columnWeight would be the solution, but it does not work.

android android-gridlayout

edited Nov 21 '18 at 12:28

Aniruddh Parihar

2,18911027

asked Nov 21 '18 at 12:27

Olivier MATROT

1,31121941

edited Nov 21 '18 at 12:28

Aniruddh Parihar

2,18911027

asked Nov 21 '18 at 12:27

Olivier MATROT

1,31121941

edited Nov 21 '18 at 12:28

Aniruddh Parihar

2,18911027

edited Nov 21 '18 at 12:28

Aniruddh Parihar

2,18911027

edited Nov 21 '18 at 12:28

Aniruddh Parihar

2,18911027

asked Nov 21 '18 at 12:27

Olivier MATROT

1,31121941

asked Nov 21 '18 at 12:27

Olivier MATROT

1,31121941

asked Nov 21 '18 at 12:27

Olivier MATROT

1,31121941

1

have you tried looking into constraint layout, it is advanced has more features codelabs.developers.google.com/codelabs/constraint-layout/…

– Karan Mer
Nov 21 '18 at 12:36

I was unsure it would be available with Xamarin.Android, but it is. Will do.

– Olivier MATROT
Nov 21 '18 at 13:10

I guess you choose a GridLayout thinking it would be easier to build the layout. But your layout is so simple that it becomes hard. You could achieve this by using ConstraintLayout or LinearLayoutsetting weight attibute in each view.

– Giovanne
Nov 21 '18 at 13:28

1

@Giovanne I ended up using a LinearLayout inside a row of the GridLayout and this is working fine.

– Olivier MATROT
Nov 22 '18 at 12:56

add a comment |

1

have you tried looking into constraint layout, it is advanced has more features codelabs.developers.google.com/codelabs/constraint-layout/…

– Karan Mer
Nov 21 '18 at 12:36

I was unsure it would be available with Xamarin.Android, but it is. Will do.

– Olivier MATROT
Nov 21 '18 at 13:10

I guess you choose a GridLayout thinking it would be easier to build the layout. But your layout is so simple that it becomes hard. You could achieve this by using ConstraintLayout or LinearLayoutsetting weight attibute in each view.

– Giovanne
Nov 21 '18 at 13:28

1

@Giovanne I ended up using a LinearLayout inside a row of the GridLayout and this is working fine.

– Olivier MATROT
Nov 22 '18 at 12:56

have you tried looking into constraint layout, it is advanced has more features codelabs.developers.google.com/codelabs/constraint-layout/…

– Karan Mer
Nov 21 '18 at 12:36

I was unsure it would be available with Xamarin.Android, but it is. Will do.

– Olivier MATROT
Nov 21 '18 at 13:10

I guess you choose a GridLayout thinking it would be easier to build the layout. But your layout is so simple that it becomes hard. You could achieve this by using ConstraintLayout or LinearLayoutsetting weight attibute in each view.

– Giovanne
Nov 21 '18 at 13:28

@Giovanne I ended up using a LinearLayout inside a row of the GridLayout and this is working fine.

– Olivier MATROT
Nov 22 '18 at 12:56

add a comment |

0

active

oldest

votes

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53412041%2fhow-can-i-size-columns-in-a-gridlayout%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

0

active

oldest

votes

0

active

oldest

votes

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

Search This Blog

Ufyukyu