内容方向

引言

大部分语言（如英语、德语、波兰语等）都是从左到右书写的。然而，也有一些语言（如阿拉伯语）使用从右到左的书写方式。

从右到左的内容方向会极大地改变布局设计：

1. 文本位置（对齐到右侧）。
2. 文本方向，即文本从右开始，向左结束。
3. 在换行时需要考虑文本方向的单词换行算法。
4. 集合中元素的顺序，例如一行中的第一个元素在从右到左模式（RTL）下应放置在最右边，而在从左到右模式（LTR）下则应放在最左边。
5. 默认内容位置（对齐到右侧）。

API

您可以使用以下 API 设置内容方向：

.ContentFromLeftToRight() // 默认
.ContentFromRightToLeft()

可以为所有后代设置目标方向：

.ContentFromRightToLeft()
.Column(column =>
{
    // 这部分内容使用继承的从右到左的内容方向
    column.Item() // ... 内容

    // 此项重置内容方向为从左到右
    column.Item().ContentFromLeftToRight() // ... 内容
});

示例

所有元素都支持从右到左（RTL）模式。以下示例展示了这种模式如何影响渲染过程。在 Row 元素中，根据内容方向显示元素。例如，在从左到右（LTR）模式下，第一个元素位于左边，而在从右到左（RTL）模式下，它位于右边：

.ContentFromRightToLeft() // LTR 或 RTL 模式
.Row(row =>
{
    row.Spacing(5);

    row.AutoItem().Height(50).Width(50).Background(Colors.Red.Lighten1);
    row.AutoItem().Height(50).Width(50).Background(Colors.Green.Lighten1);
    row.AutoItem().Height(50).Width(75).Background(Colors.Blue.Lighten1);
});

使用 Table 元素时也有类似的情况，如下所示：

.ContentFromRightToLeft() // LTR 或 RTL 模式
.Table(table =>
{
    table.ColumnsDefinition(columns =>
    {
        columns.RelativeColumn();
        columns.RelativeColumn();
        columns.RelativeColumn();
    });

    table.Cell().Height(50).Background(Colors.Red.Lighten1);
    table.Cell().Height(50).Background(Colors.Green.Lighten1);
    table.Cell().Height(50).Background(Colors.Blue.Lighten1);
    table.Cell().ColumnSpan(2).Height(50).Background(Colors.Orange.Lighten1);
});

需要注意的是，内容方向并不会影响元素的对齐方式：