CODEWITHSUNDEEP
datagridcolumn-widthapache-royale
Fred
Fred

Reputation: 419

How to set column 100% width on basic js|DataGrid on Apache Royale

I struggle with column width. I want the last column to be 100% width Apparently I can't use columnWidth="100%".

I use js|DataGrid (basic) with SDK 0.9.6

Here is my code :

<js:DataGrid localId="dg" percentWidth="100" percentHeight="100">
<js:columns>
    <js:DataGridColumn label="Date" dataField="FAC_DATE" columnWidth="120"/>
    <js:DataGridColumn label="Px. H.T." dataField="FAC_PX_HT" columnWidth="160"/>
    <js:DataGridColumn label="Label" dataField="FAC_DESIGNATION" />
</js:columns>

This is giving the following JS :

<div id="dataGridColumn2" class="last DataGridColumnList" style="overflow: hidden;vertical-align: top;left: 280px;top: 0px;width: 66px;display: inline-block;">

The issue is width: 66px; . How can I get rid of this ? I try this in styles (in the mxml containing my DataGrid) :

<fx:Style>
    @namespace j "library://ns.apache.org/royale/jewel";
    @namespace js "library://ns.apache.org/royale/basic";
    .last   {
        width: "max-content";
    }
</fx:Style>

Also try 

    <js:DataGridColumn label="Label" dataField="FAC_DESIGNATION" className="mycolumnmax" />

And

.mycolumnmax   {
    width: "max-content";
}

But this isn't working, it's like my classname is ignored.

Please Help !

Upvotes: 0

Views: 172

Answers (2)

s.rajput
s.rajput

Reputation: 1

<js:DataGrid localId="dg" percentWidth="100" percentHeight="100">
<js:columns>
    <js:DataGridColumn label="Date" dataField="FAC_DATE" columnWidth="120"/>
    <js:DataGridColumn label="Px. H.T." dataField="FAC_PX_HT" columnWidth="160"/>
    <js:DataGridColumn label="Label" dataField="FAC_DESIGNATION" percentColumnWidth="100"/>
</js:columns>

Upvotes: 0

yishayw
yishayw

Reputation: 151

It looks to me like this is not currently supported. Royale currently has DataGridLayout and DataGridPercentageLayout, the former being the default. When DataGridLayout sees a non defined column width (3rd column in your example), it just assumes equal distribution of widths, i.e. the total grid width divided by the number of columns.

I suggest you open an issue on GitHub and request a new layout, or get involved and create one.

To speed things up you can always consult commercial support [1].

[1] https://royale.apache.org/royale-commercial-support/

Upvotes: 0

Related Questions