protected static HtmlTag ContainerRender(AdaptiveContainer container, AdaptiveRenderContext context) { var uiContainer = new DivTag() .AddClass($"ac-{container.Type.Replace(".", "").ToLower()}"); AddContainerElements(uiContainer, container.Items, null, context); if (context.Config.SupportsInteractivity && container.SelectAction != null) { uiContainer.AddClass("ac-selectable"); AddActionAttributes(container.SelectAction, uiContainer, context); } return(uiContainer); }
protected static HtmlTag ImageRender(AdaptiveImage image, AdaptiveRendererContext context) { var uiDiv = new DivTag() .AddClass($"ac-{image.Type.Replace(".", "").ToLower()}") .Style("display", "block") .Style("box-sizing", "border-box"); switch (image.Size) { case AdaptiveImageSize.Auto: uiDiv = uiDiv.Style("max-width", $"100%"); break; case AdaptiveImageSize.Small: uiDiv = uiDiv.Style("max-width", $"{context.Config.ImageSizes.Small}px"); break; case AdaptiveImageSize.Medium: uiDiv = uiDiv.Style("max-width", $"{context.Config.ImageSizes.Medium}px"); break; case AdaptiveImageSize.Large: uiDiv = uiDiv.Style("max-width", $"{context.Config.ImageSizes.Large}px"); break; case AdaptiveImageSize.Stretch: uiDiv = uiDiv.Style("width", $"100%"); break; } var uiImage = new HtmlTag("img") .Style("width", "100%") .Attr("alt", image.AltText ?? "card image") .Attr("src", image.Url.ToString()); switch (image.Style) { case AdaptiveImageStyle.Default: break; case AdaptiveImageStyle.Person: uiImage = uiImage.Style("background-position", "50% 50%") .Style("border-radius", "50%") .Style("background-repeat", "no-repeat"); break; } switch (image.HorizontalAlignment) { case AdaptiveHorizontalAlignment.Left: uiDiv = uiDiv.Style("overflow", "hidden") .Style("display", "block"); break; case AdaptiveHorizontalAlignment.Center: uiDiv = uiDiv.Style("overflow", "hidden") .Style("margin-right", "auto") .Style("margin-left", "auto") .Style("display", "block"); break; case AdaptiveHorizontalAlignment.Right: uiDiv = uiDiv.Style("overflow", "hidden") .Style("margin-left", "auto") .Style("display", "block"); break; } uiDiv.Children.Add(uiImage); if (context.Config.SupportsInteractivity && image.SelectAction != null) { uiDiv.AddClass("ac-tap"); } return(uiDiv); }
protected static HtmlTag ColumnSetRender(AdaptiveColumnSet columnSet, AdaptiveRendererContext context) { var uiColumnSet = new DivTag() .AddClass($"ac-{columnSet.Type.Replace(".", "").ToLower()}") .Style("overflow", "hidden") .Style("display", "flex"); if (context.Config.SupportsInteractivity && columnSet.SelectAction != null) { uiColumnSet.AddClass("ac-tap"); } var max = Math.Max(1.0, columnSet.Columns.Select(col => { if (col.Width != null && double.TryParse(col.Width, out double widthVal)) { return(widthVal); } #pragma warning disable CS0618 // Type or member is obsolete if (double.TryParse(col.Size ?? "0", out double val)) #pragma warning restore CS0618 // Type or member is obsolete { return(val); } return(0); }).Sum()); foreach (var column in columnSet.Columns) { var uiColumn = context.Render(column); // Add horizontal Seperator if (uiColumnSet.Children.Any() && (column.Separator || column.Spacing != AdaptiveSpacing.None)) { SeparatorConfig sep = context.Config.Separator; int spacing = context.Config.GetSpacing(column.Spacing) / 2; int lineThickness = column.Separator ? sep.LineThickness : 0; if (sep != null) { uiColumnSet.Children.Add(new DivTag() .AddClass($"ac-columnseparator") .Style("flex", "0 0 auto") .Style("padding-left", $"{spacing}px") .Style("margin-left", $"{spacing}px") .Style("border-left-color", $"{context.GetRGBColor(sep.LineColor)}") .Style("border-left-width", $"{lineThickness}px") .Style("border-left-style", $"solid")); } } // do some sizing magic var width = column.Width?.ToLower(); if (string.IsNullOrEmpty(width)) #pragma warning disable CS0618 // Type or member is obsolete { width = column.Size?.ToLower(); } #pragma warning restore CS0618 // Type or member is obsolete if (width == null || width == AdaptiveColumnWidth.Stretch.ToLower()) { uiColumn = uiColumn.Style("flex", "1 1 auto"); } else if (width == AdaptiveColumnWidth.Auto.ToLower()) { uiColumn = uiColumn.Style("flex", "0 1 auto"); } else { double val; if (double.TryParse(width, out val)) { var percent = Convert.ToInt32(100 * (val / max)); uiColumn = uiColumn.Style("flex", $"1 1 {percent}%"); } else { uiColumn = uiColumn.Style("flex", "0 0 auto"); } } uiColumnSet.Children.Add(uiColumn); } return(uiColumnSet); }