drawerContentSize not working

[Grégory]

Hello,

 

I'm using a RadSideDrawer with Nativescript Angular (pro version)

I'm unable to set the drawerContentSize property, it's never change the height (or the width) of the menu panel.

 

I have tried to set it programmatically :

@ViewChild(RadSideDrawerComponent) public drawerComponent: RadSideDrawerComponent;

ngOnInit() {
     this.drawerComponent.drawerContentSize = 800;
}

 

Or directly inside the view :

<RadSideDrawer  [drawerLocation]="currentDrawLocation" [drawerContentSize]="500">
      ..............

</RadSideDrawer>

 

Both are not working.

 

Thanks for your help

[Nick Iliev]

Hello Gregory,

The reason for you side drawer content size not to change the code in your code behind is because you are passing too large value. With a relatively common device with e.g. something like 1080 x 1920 (420dpi) then a value of 400 will set approx 80% width (for left/right side drawer)/ The reason is that the value you are setting is device independent pixels.
e.g.

@ViewChild(RadSideDrawerComponent) public drawerComponent: RadSideDrawerComponent;

ngOnInit() {
     this.drawerComponent.drawerContentSize = 400;
}

will result in the following drawer(on a Nexus-5 device)


When setting the value to 200 on the same device, it will produce the following width:


More about device independent pixels (a.k.a. as dp or dip) and the formula used for their creation can be found here.

Your HTML related code will also work on the same principle but with one correction.
e.g.

<RadSideDrawer drawerContentSize="200" >

Note that now our property lacks the binding brackets and we are passing the value directly.
The code above was tested and verified with modifying this example.

Regards,
Nikolay Iliev
Telerik by Progress

[Grégory]

Sorry for response delay, but now it's working with version 2.0.1