I'm trying to create a Grid with RadzenSplitter but i just don't get it right.
I tried to rebuild the RenderTreeBuilder via the auto generated code from the .razor.g.cs file to get a working example.
When i start my application nothing appears and i don't get any error message.
Is there any proper way to build this?
<RadzenSplitter Orientation="Orientation.Vertical" Collapse=@OnCollapse Expand=@OnExpand style="height: 90%; border: 1px solid rgba(0,0,0,.08);">
<RadzenSplitterPane Size="250px">
<RadzenSplitter Collapse=@OnCollapse Expand=@OnExpand Resize=@OnResize>
<RadzenSplitterPane>
<ArcGauge @ref=@arcGauge />
</RadzenSplitterPane>
<RadzenSplitterPane>
<RadialGauge @ref=@radialGauge />
</RadzenSplitterPane>
<RadzenSplitterPane>
<GoogleMap @ref=@googleMap />
</RadzenSplitterPane>
</RadzenSplitter>
</RadzenSplitterPane>
</RadzenSplitter>
My code:
<h3>Dashboard V2 </h3>
<button class="btn btn-primary" @onclick="RenderComponent">Render Dashboard</button>
<button class="btn btn-primary" @onclick="RenderExampelComponent">Render Exampel</button>
@RuntimeRender
@code {
EventConsole console;
ArcGauge arcGauge;
RadialGauge radialGauge;
TableComponent tableComponent;
GoogleMap googleMap;
private RenderFragment RuntimeRender { get; set; }
private RenderFragment CreateTree() => builder => {
builder.AddMarkupContent(0, "<h3>AutoGenerated Code</h3>");
builder.OpenComponent < RadzenSplitter > (1);
builder.AddAttribute(2, "Orientation", Orientation.Vertical);
builder.AddAttribute(3, "Collapse", EventCallback.Factory.Create < RadzenSplitterEventArgs > (this, OnCollapse));
builder.AddAttribute(4, "Expand", EventCallback.Factory.Create < RadzenSplitterEventArgs > (this, OnExpand));
builder.AddAttribute(5, "style", "height: 90%; border: 1px solid rgba(0,0,0,.08);");
builder.AddAttribute(6, "ChildContent", (RenderFragment)((builder2) => {
builder2.AddMarkupContent(7, "\r\n ");
builder2.OpenComponent < RadzenSplitterPane > (8);
builder2.AddAttribute(9, "Size", "250px");
builder2.AddAttribute(10, "ChildContent", (RenderFragment)((builder3) =>
{
builder3.AddMarkupContent(11, "\r\n ");
builder3.OpenComponent < RadzenSplitter > (12);
builder3.AddAttribute(13, "Collapse", EventCallback.Factory.Create < RadzenSplitterEventArgs > (this, OnCollapse));
builder3.AddAttribute(14, "Expand", EventCallback.Factory.Create < RadzenSplitterEventArgs > (this, OnExpand));
builder3.AddAttribute(15, "Resize", EventCallback.Factory.Create < RadzenSplitterResizeEventArgs > (this, OnResize));
builder3.AddAttribute(16, "ChildContent", (RenderFragment)((builder4) =>
{
builder4.AddMarkupContent(17, "\r\n ");
builder4.OpenComponent < RadzenSplitterPane > (18);
builder4.AddAttribute(19, "ChildContent", (RenderFragment)((builder5) =>
{
builder5.AddMarkupContent(20, "\r\n ");
builder5.OpenComponent < ArcGauge > (21);
builder5.AddComponentReferenceCapture(22, (value) => {
builder5.AddComponentReferenceCapture(22, (value) => {});
builder5.CloseComponent();
builder5.AddMarkupContent(23, "\r\n ");
});
}));
builder4.CloseComponent();
builder4.AddMarkupContent(24, " \r\n ");
builder4.OpenComponent < RadzenSplitterPane > (25);
builder4.AddAttribute(26, "ChildContent", (RenderFragment)((builder5) =>
{
builder5.AddMarkupContent(27, "\r\n ");
builder5.OpenComponent < RadialGauge > (28);
builder5.AddComponentReferenceCapture(29, (value) =>
{
radialGauge = (RadialGauge)value;
});
builder5.CloseComponent();
builder5.AddMarkupContent(30, "\r\n ");
}));
builder4.CloseComponent();
builder4.AddMarkupContent(31, "\r\n ");
builder4.OpenComponent<RadzenSplitterPane>(32);
builder4.AddAttribute(33, "ChildContent", (RenderFragment)((builder5) =>
{
builder5.AddMarkupContent(34, "\r\n ");
builder5.OpenComponent<GoogleMap>(35);
builder5.AddComponentReferenceCapture(36, (value) =>
{
googleMap = (GoogleMap)value;
});
builder5.CloseComponent();
builder5.AddMarkupContent(37, "\r\n ");
}));
builder4.CloseComponent();
builder4.AddMarkupContent(38, "\r\n ");
}));
builder3.CloseComponent();
builder3.AddMarkupContent(39, "\r\n ");
}));
builder2.CloseComponent();
builder2.AddMarkupContent(40, "\r\n ");
}));
builder.CloseComponent();
builder.AddMarkupContent(41, "\r\n\r\n");
};
private void RenderComponent()
{
RuntimeRender = CreateTree();
}
Edit: Changed wrong information and tried to be more specific