No way to bottom align content

[ChrisWPDX]

For fixed size cards like Timeline there's no good way to place content at the bottom of the card. It'd be useful to add something like a vertical alignment to container to provide that.

[qpongo]

Here's how I did it for fixed size cards...

This function returns a column which is padded to the height I want -- not final form to handle all cases but it works for what I need...

        /// <summary>
        /// This function creates vertical space inside of a column.
        /// </summary>
        /// <param name="totalWidthToUse">total width of the existing column that we putting this guy in</param>
        /// <param name="desiredHeight">desired height of the space that we are creating</param>
        /// <returns></returns>
        ColumnSet GetSpacerColumnSet(int totalWidthToUse, int desiredHeight)
        {
            // NOTE: height and width are pretty much interchangeable because the 1x1 image square so the output image (resized) will be square also
            
            // We can only make a spacer as high as the total width (i.e. square with this 1x1px method)
            if (desiredHeight > totalWidthToUse - 10)    // 10 for the column padding
            {
                desiredHeight = totalWidthToUse - 10;
            }

            int fillerColumnWidth = totalWidthToUse - desiredHeight - 10;

            return new ColumnSet()
            {
                Separation = SeparationStyle.None,
                Columns = new List<Column>()
                {
                    new Column()
                    {
                        Size = $"{desiredHeight}",   // this causes height to be equal to the width
                        Items = new List<CardElement>()
                        {
                            new Image()
                            {
                                Separation = SeparationStyle.None,
                                Size = ImageSize.Auto,
#if DEBUG
                                Url = "https://--static-image-server--/images/Purple1x1.png"
#else
                                Url = "https://--static-image-server--/images/T1x1.png"       // Transparent pixels for production
#endif
                            }
                        }
                    },
                    // There will be a 10 pixel spacing in between
                    new Column()
                    {
                        Size = $"{fillerColumnWidth}",
                        Items = new List<CardElement>()
                        {
                            new TextBlock()
                            {
                                Separation = SeparationStyle.None,
                                Text = " "
                            }
                        }
                    }
                }
            };
        }

Then I use it like this...

colLeft.Items.Add(GetSpacerColumnSet(455, 25));

[matthidinger]

Thanks folks. We're tracking support for this in #484