How to set Vertical aligment uniLabel

[Freeman35]

Hello,

How to set Vertical aligment to middle or other for uniLabel in css ?

Regards

[Sherzod]

Hi,

 

Can you try this ?:

.myCls {
    vertical-align: middle;
    text-align: center;
    display: table-cell;
    position: relative !important;
}

function beforeInit(sender, config)
{
    config.cls = "myCls";
}

Best regards,

[Freeman35]

exactly as what I want.

Thank you very much.

[evandromira]

Hi,

 

Can you try this ?:

.myCls {
    vertical-align: middle;
    text-align: center;
    display: table-cell;
    position: relative !important;
}

function beforeInit(sender, config)
{
    config.cls = "myCls";
}

Best regards,

Onde coloco .myCls?

[Sherzod]

Onde coloco .myCls?

Hi,

 

Which version and build are you using?

[Volk65]

Hi

 

When a label is created at Runtime, as in this case, set the vertical alignment?

As I understand it in this case, beforeInit will no longer work?

[Sherzod]

Hi,

 

No, it will work, here are a few ways:

 

CustomCSS:

.myCls {
    vertical-align: middle;
    text-align: center;
    display: table-cell;
    position: relative !important;
}

1. beforeInit:

...
newUniLabel.Name := 'newUniLabel';
newUniLabel.AutoSize := False;
newUniLabel.Width := 200;
newUniLabel.ClientEvents.Enabled := True;
newUniLabel.ClientEvents.UniEvents.Values['beforeInit'] := 'function (sender, config) {config.cls="myCls"}';
...

2. JSInterface:

...
newUniLabel.Name := 'newUniLabel';
newUniLabel.AutoSize := False;
newUniLabel.Width := 200;
newUniLabel.JSInterface.JSCall('addCls', ['myCls']);
...

Best regards,

[Volk65]

Great!

The first option didn't work. Maybe the fact that the align=alclient.

But the second option works! Just in case here is the code for creating buttons:

procedure TMainForm.CreateButton(DClass, FrameDesc: String; MenuIndex: Integer);
var MainPan: TUniPanel;
    Image: TUniImage;
    Lbl: TUniLabel;
begin
  // Creating PseudoButton (UniPanel)
  MainPan:=TUniPanel.Create(Self);
  with MainPan do begin
    Align:=alTop;
    Parent:=panMenu;
    BorderStyle:=ubsOutset;
    Color:=clSkyBlue;
    Cursor:=crHandPoint;
    AlignWithMargins:=True;
    Margins.Bottom:=1;
    Margins.Left:=1;
    Margins.Right:=1;
    Margins.Top:=0;
    Height:=73;
    Top:=999;
    Tag:=MenuIndex;
    OnClick:=OnMenuClick;
    OnMouseEnter:=OnMenuMouseEnter;
    OnMouseLeave:=OnMenuMouseLeave;
    OnMouseDown:=OnMenuMouseDown;
    OnMouseUp:=OnMenuMouseUp;
  end;
  // Creating Image (leftAligned)
  Image:=TUniImage.Create(Self);
  with Image do begin
    AutoSize:=False;
    Align:=alLeft;
    AlignWithMargins:=True;
    Cursor:=crHandPoint;
    Parent:=MainPan;
    Margins.Bottom:=6;
    Margins.Left:=6;
    Margins.Right:=0;
    Width:=64;
    Transparent:=True;
//    URL:='files\FrameIcons\'+DClass+'.png';
    OnMouseEnter:=OnMenuMouseEnter;
    OnMouseDown:=OnMenuMouseDown;
    OnMouseUp:=OnMenuMouseUp;
  end;
  // Creating Label (clientAligned)
  Lbl:=TUniLabel.Create(Self);
  with Lbl do begin
    AutoSize:=False;
    Align:=alClient;
    ClientEvents.Enabled:=true;
    AlignWithMargins:=True;
    Parent:=MainPan;
    Caption:=FrameDesc;
    Cursor:=crHandPoint;
    Margins.Left:=5;
    Margins.Right:=6;
    JSInterface.JSCall('addCls', ['myCls']);
    OnMouseEnter:=OnMenuMouseEnter;
    OnMouseDown:=OnMenuMouseDown;
    OnMouseUp:=OnMenuMouseUp;
  end;
end;

[Sherzod]

The first option didn't work. Maybe the fact that the align=alclient.

 

You must assign a name to the component

 

1. beforeInit:

...
newUniLabel.Name := 'newUniLabel'; // <-----------------------
newUniLabel.AutoSize := False;
newUniLabel.Width := 200;
newUniLabel.ClientEvents.Enabled := True;
newUniLabel.ClientEvents.UniEvents.Values['beforeInit'] := 'function (sender, config) {config.cls="myCls"}';
...