protected static void AddContainerElements(HtmlTag uiContainer, IList <AdaptiveElement> elements, IList <AdaptiveAction> actions, AdaptiveRendererContext context) { if (elements != null) { foreach (var cardElement in elements) { // each element has a row var uiElement = context.Render(cardElement); if (uiElement != null) { if (uiContainer.Children.Any()) { AddSeparator(uiContainer, cardElement, context); } uiContainer.Children.Add(uiElement); } } } if (context.Config.SupportsInteractivity && actions != null) { var uiButtonStrip = new DivTag() .AddClass("ac-actionset") .Style("display", "flex"); // contains ShowCardAction.AdaptiveCard var uiShowCardStrip = new DivTag() .Style("margin-top", context.Config.Actions.ShowCard.InlineTopMargin + "px"); if (context.Config.Actions.ActionsOrientation == ActionsOrientation.Horizontal) { uiButtonStrip.Style("flex-direction", "row"); switch (context.Config.Actions.ActionAlignment) { case AdaptiveHorizontalAlignment.Center: uiButtonStrip.Style("justify-content", "center"); break; case AdaptiveHorizontalAlignment.Right: uiButtonStrip.Style("justify-content", "flex-end"); break; default: uiButtonStrip.Style("justify-content", "flex-start"); break; } } else { uiButtonStrip.Style("flex-direction", "column"); switch (context.Config.Actions.ActionAlignment) { case AdaptiveHorizontalAlignment.Center: uiButtonStrip.Style("align-items", "center"); break; case AdaptiveHorizontalAlignment.Right: uiButtonStrip.Style("align-items", "flex-end"); break; case AdaptiveHorizontalAlignment.Stretch: uiButtonStrip.Style("align-items", "stretch"); break; default: uiButtonStrip.Style("align-items", "flex-start"); break; } } var maxActions = Math.Min(context.Config.Actions.MaxActions, actions.Count); for (var i = 0; i < maxActions; i++) { // add actions var uiAction = context.Render(actions[i]); if (uiAction != null) { if (actions[i] is AdaptiveShowCardAction showCardAction) { // add button-card mapping for clients to implement showcard action //var cardId = "ac-showCard" + i; //uiAction.Attr("ac-cardId", cardId); var cardId = uiAction.Attributes["data-ac-showCardId"]; var uiCard = context.Render(showCardAction.Card); if (uiCard != null) { uiCard.Attr("id", cardId) .AddClass("ac-showCard") .Style("display", "none"); uiShowCardStrip.Children.Add(uiCard); } } uiButtonStrip.Children.Add(uiAction); } // add spacer between buttons according to config if (i < maxActions - 1 && context.Config.Actions.ButtonSpacing > 0) { var uiSpacer = new DivTag(); if (context.Config.Actions.ActionsOrientation == ActionsOrientation.Horizontal) { uiSpacer.Style("flex", "0 0 auto"); uiSpacer.Style("width", context.Config.Actions.ButtonSpacing + "px"); } else { uiSpacer.Style("height", context.Config.Actions.ButtonSpacing + "px"); } uiButtonStrip.Children.Add(uiSpacer); } } if (uiButtonStrip.Children.Any()) { AdaptiveCardRenderer.AddSeparator(uiContainer, new AdaptiveContainer(), context); uiContainer.Children.Add(uiButtonStrip); } if (uiShowCardStrip.Children.Any()) { uiContainer.Children.Add(uiShowCardStrip); } } }
protected static void AddContainerElements(HtmlTag uiContainer, IList <AdaptiveElement> elements, IList <AdaptiveAction> actions, AdaptiveRenderContext context) { if (elements != null) { foreach (var cardElement in elements) { // each element has a row var uiElement = context.Render(cardElement); if (uiElement != null) { if (uiContainer.Children.Any()) { AddSeparator(uiContainer, cardElement, context); } uiContainer.Children.Add(uiElement); } } } if (context.Config.SupportsInteractivity && actions != null) { var uiButtonStrip = new DivTag() .AddClass("ac-actionset") .Style("display", "flex"); var actionsConfig = context.Config.Actions; // TODO: This top marging is currently being double applied, will have to investigate later //.Style("margin-top", $"{context.Config.GetSpacing(context.Config.Actions.Spacing)}px"); // contains ShowCardAction.AdaptiveCard var showCards = new List <HtmlTag>(); if (actionsConfig.ActionsOrientation == ActionsOrientation.Horizontal) { uiButtonStrip.Style("flex-direction", "row"); switch (actionsConfig.ActionAlignment) { case AdaptiveHorizontalAlignment.Center: uiButtonStrip.Style("justify-content", "center"); break; case AdaptiveHorizontalAlignment.Right: uiButtonStrip.Style("justify-content", "flex-end"); break; default: uiButtonStrip.Style("justify-content", "flex-start"); break; } } else { uiButtonStrip.Style("flex-direction", "column"); switch (actionsConfig.ActionAlignment) { case AdaptiveHorizontalAlignment.Center: uiButtonStrip.Style("align-items", "center"); break; case AdaptiveHorizontalAlignment.Right: uiButtonStrip.Style("align-items", "flex-end"); break; case AdaptiveHorizontalAlignment.Stretch: uiButtonStrip.Style("align-items", "stretch"); break; default: uiButtonStrip.Style("align-items", "flex-start"); break; } } var maxActions = Math.Min(actionsConfig.MaxActions, actions.Count); // See if all actions have icons, otherwise force the icon placement to the left var oldConfigIconPlacement = actionsConfig.IconPlacement; bool allActionsHaveIcons = true; for (var i = 0; i < maxActions; i++) { if (string.IsNullOrEmpty(actions[i].IconUrl)) { allActionsHaveIcons = false; break; } } if (!allActionsHaveIcons) { actionsConfig.IconPlacement = IconPlacement.LeftOfTitle; } for (var i = 0; i < maxActions; i++) { // add actions var uiAction = context.Render(actions[i]); if (uiAction != null) { if (actions[i] is AdaptiveShowCardAction showCardAction) { var cardId = uiAction.Attributes["data-ac-showCardId"]; var uiCard = context.Render(showCardAction.Card); if (uiCard != null) { uiCard.Attr("id", cardId) .AddClass("ac-showCard") .Style("padding", "0") .Style("display", "none") .Style("margin-top", $"{actionsConfig.ShowCard.InlineTopMargin}px"); showCards.Add(uiCard); } } uiButtonStrip.Children.Add(uiAction); } // add spacer between buttons according to config if (i < maxActions - 1 && actionsConfig.ButtonSpacing > 0) { var uiSpacer = new DivTag(); if (actionsConfig.ActionsOrientation == ActionsOrientation.Horizontal) { uiSpacer.Style("flex", "0 0 auto"); uiSpacer.Style("width", actionsConfig.ButtonSpacing + "px"); } else { uiSpacer.Style("height", actionsConfig.ButtonSpacing + "px"); } uiButtonStrip.Children.Add(uiSpacer); } } if (uiButtonStrip.Children.Any()) { AdaptiveCardRenderer.AddSeparator(uiContainer, new AdaptiveContainer(), context); uiContainer.Children.Add(uiButtonStrip); } foreach (var showCard in showCards) { uiContainer.Children.Add(showCard); } // Restore the iconPlacement for the context. actionsConfig.IconPlacement = oldConfigIconPlacement; } }