Solves requests

• Outlook

Summary

Add a rtl Boolean property to AdaptiveCard. When set to true, the card renders in right-to-left.

Design

Adaptive renderers will look for the rtl property at the AdaptiveCard level and adjust rendering accordingly.

{
    "$schema": "https://adaptivecards.io/schemas/adaptive-card.json",
    "type": "AdaptiveCard",
    "version": "1.0",
    "rtl" : true | false, 
    "body": […..]
}

If a card is specified to render in RTL direction, here are some of the things that will change :

Column Layout

By default, the columns in a ColumnSet are rendered left-to-right in horizontal direction. This will change to right-to-left in case of RTL.

LTR with Columns and separators:

RTL with Columns and separators:

Text Alignment

• Text that would be left aligned in LTR is right aligned in RTL
• Text that would be right aligned in LTR is left aligned in RTL
• Text that would be centered in LTR remains centered in RTL

Example

LTR:

RTL:

Padding and margins

Left and right paddings/margins in LTR become right and left in RTL.

Inputs

• Text in inputs, which is left aligned in LTR, becomes right aligned in RTL. That includes both the input value and placeholder.
• Controls within an input (namely radio buttons, check boxes, the dropdown button on a combo box or the calendar button on a date picker) become right aligned in RTL

Example

LTR.

RTL:

Text directionality

Text specified in LTR languages should translate to follow RTL directionality.

An example would be : 'Hello World!' should translate to "!Hello World' in RTL.

More details here - https://dotancohen.com/howto/rtl_right_to_left.html

Down-level impact

None.

Host burden

Very low. Just update to the new Adaptive renderer which does all the work.