Jump to content

dbGrid mobile - How to set row height and its font?


AMIT

Recommended Posts

Hi,

 

For now you can try this:

 

1. UnimDBGrid1 -> ClientEvents -> UniEvents ... beforeInit fn:

function beforeInit(sender, config)
{
  config.itemHeight = 30;
}

2. UniServerModule -> CustomCSS ... add

.x-grid .x-grid-cell {
    height: 30px !important;
    line-height: 30px !important;
    font-family: 'Times New Roman', Times, serif;
    font-size:  11pt;
}

Best regards.

Link to comment
Share on other sites

Hi,

 

Try...

 

1. UnimDBGrid1 -> ClientEvents -> UniEvents ... beforeInit fn:

function beforeInit(sender, config)
{
  config.itemHeight = 30;
  config.headerContainer = {
    height: 30
  };
}

2. UniServerModule -> CustomCSS ... add

.x-grid .x-grid-column {
    border-style: solid;
    border-width: 1px 1px 0;
    height: 30px;
    line-height: 30px;
    padding: 0 8px;
    vertical-align: middle;
    font-family: 'Times New Roman', Times, serif;
    font-size:  11pt;
    font-weight: bold;
}

.x-grid .x-grid-cell {
    height: 30px !important;
    line-height: 30px !important;
    font-family: 'Times New Roman', Times, serif;
    font-size:  11pt;
}

Best regards.

Link to comment
Share on other sites

hi, how to set tab height and its font on ​pagecontrol

Hi,

 

Try...

 

1. UnimDBGrid1 -> ClientEvents -> UniEvents ... beforeInit fn:

function beforeInit(sender, config)
{
  config.itemHeight = 30;
  config.headerContainer = {
    height: 30
  };
}

2. UniServerModule -> CustomCSS ... add

.x-grid .x-grid-column {
    border-style: solid;
    border-width: 1px 1px 0;
    height: 30px;
    line-height: 30px;
    padding: 0 8px;
    vertical-align: middle;
    font-family: 'Times New Roman', Times, serif;
    font-size:  11pt;
    font-weight: bold;
}

.x-grid .x-grid-cell {
    height: 30px !important;
    line-height: 30px !important;
    font-family: 'Times New Roman', Times, serif;
    font-size:  11pt;
}

Best regards.

Link to comment
Share on other sites

  • 1 year later...

This code is for when you want to apply CSS in a single UnimDBGrid, which in this case we should give a nickname to the CSS that goes to the UnimDBGrid1:

 

 

1. UnimDBGrid1 -> ClientEvents -> UniEvents ... beforeInit fn:

function beforeInit(sender, config)
{
    config.cls="mGridCliente";
    config.itemHeight = 30;
    config.headerContainer = {height: 30};
}

2. UniServerModule -> CustomCSS ... add

.mGridCliente .x-grid-column {
    border-style: solid;
    border-width: 1px 1px 0;
    height: 30px;
    line-height: 30px;
    padding: 0 8px;
    vertical-align: middle;
    font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
    font-size:  9pt;
    font-weight: bold;
    width: 100%;
    text-align: center;
    background-color: #4CAF50;
    color: white;	
}

.mGridCliente .x-grid-cell {
    height: 40px !important;
    line-height: 30px !important;
    font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
    font-size:  18pt;
    font-weight: bold;
    color: black;
    border-collapse: collapse;
    width: 100%;	
    background-color: #99ccff;
}
Link to comment
Share on other sites

  • 10 months later...
On 2/11/2019 at 4:24 AM, milanius said:

I tried set config.itemHeight = 30 and it doesn't work in version 1.70.0.1485 Is any other possibility how to set row height in TUnimDBGrid? Setting of header height works perfect...

Hi,

Can you try this approach (even without CustomCSS) ?!:

function beforeInit(sender, config) 
{
    var _height = 30;

    config.itemConfig = {
        height: _height
    };

    config.headerContainer = {
        height: _height
    };
}

 

Link to comment
Share on other sites

4 hours ago, Sherzod said:

Hi,

Can you try this approach (even without CustomCSS) ?!:


function beforeInit(sender, config) 
{
    var _height = 30;

    config.itemConfig = {
        height: _height
    };

    config.headerContainer = {
        height: _height
    };
}

 

Hi, it works great, thanks! 

Link to comment
Share on other sites

  • 1 year later...
On 5/11/2020 at 8:33 PM, Sherzod said:

Hi,

Sorry for the late response.

Please explain in more detail what does not work?

 

hi sherzod i have one similar quest about height of column header of unidbgrid.

how change a default size when this component is created
look at moment he is created at 32px in theme triton.
btw i want to change that size.

if i change in custom css this broken my others elements
look the image

image.thumb.png.b977282eb91878f85d89e7e2c7ba77bc.png

Link to comment
Share on other sites

On 5/15/2020 at 5:24 PM, Sherzod said:

Hello Crystian,

Which build of UniGUI are you using?

The above configuration does not work? Do you want to change the height of the header?

im use 1.90.0.1523 

 

On 2/12/2019 at 6:28 AM, Sherzod said:

Hi,

Can you try this approach (even without CustomCSS) ?!:


function beforeInit(sender, config) 
{
    var _height = 30;

    config.itemConfig = {
        height: _height
    };

    config.headerContainer = {
        height: _height
    };
}

 

 i tried that config but not work 

 

 

Link to comment
Share on other sites

46 minutes ago, Sherzod said:

Can you try this approach for example?:


function painted(sender, eOpts)
{
    sender.getHeaderContainer().setHeight(60);
}

no sucess
image.png.50268157998a8203e54a2110dd5fe029.png

function beforeInit(sender, config) 
{  
   function painted(sender, eOpts)
   {
    sender.getHeaderContainer().setHeight(60);
   }
}

Link to comment
Share on other sites

7 minutes ago, Sherzod said:

function reconfigure(sender, store, columns, oldStore, oldColumns, eOpts)
{
    columns.forEach(function(col){col.setHeight(60)});
}

 

nice! thats works, 
taking advantage of the moment, it is possible to make the same configuration on the pager?
image.png.1ed2e64a89fdc23a565c7991005ede51.png

Link to comment
Share on other sites

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
×
×
  • Create New...