Центрируйте текст, используя SfDataGrid для UWP Synchfusion с динамическими столбцами - PullRequest
Новая
       41

Центрируйте текст, используя SfDataGrid для UWP Synchfusion с динамическими столбцами

0 голосов
/ 13 марта 2019

Я пытаюсь центрировать текст в ячейках для SfDataGrid в UWP.Столбцы связываются во время выполнения, поэтому я не могу установить стиль ячейки для элементов столбца.

xaml для сетки выглядит так: 

                  <grid:SfDataGrid Name="GridData"
                                     AlternatingRowStyle="{StaticResource mainTableRowStyle}"
                                     RowStyle="{StaticResource mainTableRowStyle}"
                                     HeaderStyle="{StaticResource headerStyle}"
                                     Foreground="WhiteSmoke"
                                     framework:FocusExtension.IsFocused="{Binding Focused}"
                                     AllowSelectionOnPointerPressed="True"
                                     Grid.Row="0"
                                     Columns="{Binding SfGridColumns, Mode=TwoWay}"
                                     AutoGenerateColumns="True"
                                     IsDynamicItemsSource="True"
                                     ItemsSource="{Binding ElementName=dataPager,Path=PagedSource}"
                                     ColumnSizer="Star"
                                     AllowSorting="False"
                                     SelectedItem="{Binding SelectedGridItem, Mode =TwoWay, UpdateSourceTrigger=PropertyChanged}">
                        <interactivity:Interaction.Behaviors>
                            <core:EventTriggerBehavior EventName="Holding">
                                <core:InvokeCommandAction Command="{Binding HoldCommand}" />
                            </core:EventTriggerBehavior>
                        </interactivity:Interaction.Behaviors>
                    </grid:SfDataGrid>

Я попытался добавить стиль вячейки для выравнивания текста: 

    <Style x:Key="cellStyle" TargetType="grid:GridCell">
        <Setter Property="FontSize" Value="20" />
        <Setter Property="HorizontalAlignment" Value="Center"/>
        <Setter Property="FontWeight" Value="Bold" />
    </Style>
   <!-- CellStyle="{StaticResource cellStyle}" -->

Но это не помогает, потому что это центрирует всю ячейку, и внутренние границы сетки нарушаются.(выглядит примерно так, как показано на рисунке ниже)

enter image description here

Я хочу, чтобы текст внутри ячейки был выровнен.(также пробовал центр HorizontalContentAlignment, он ничего не делал)

Наконец, я попытался переписать шаблон ячейки.SfDataGrid не имеет свойства CellTemplate, но имеет свойство GridCellTemplateSelector.Итак, я создал такой шаблон: 

    <framework:GridCellTemplateSelector x:Key="templateSelector"/>
    <DataTemplate x:Key="CellTemplate1">
        <TextBlock Foreground="DarkBlue" Text="{Binding}" HorizontalAlignment="Center"/>
    </DataTemplate> <!-- and added CellTemplateSelector="{StaticResource templateSelector}" to the grid -->

public class GridCellTemplateSelector : DataTemplateSelector
    {
    protected override DataTemplate SelectTemplateCore(object item, DependencyObject container)
        {
            return Application.Current.Resources["CellTemplate1"] as DataTemplate;
        }
    }

Этот шаблон также не работает, потому что кажется, что метод в GridCellTemplateSelector не используется.Я думаю, что если бы я мог заставить работать CellTemplateSelector, я бы достиг своей цели.

1 Ответ

1 голос
/ 14 марта 2019

GridCellTemplateSelector не для вашего сценария.У sfDataGrid есть CellTemplate, он доступен для столбцов.

Я сделал пример кода для вашей справки: 

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <syncfusion:SfDataGrid x:Name="dataGrid"
                           ItemsSource="{Binding Orders}">
    </syncfusion:SfDataGrid>
</Grid>

public class OrderInfo
{
    int orderID;
    string customerId;
    string customerName;

    public int OrderID
    {
        get { return orderID; }
        set { orderID = value; }
    }

    public string CustomerID
    {
        get { return customerId; }
        set { customerId = value; }
    }

    public string CustomerName
    {
        get { return customerName; }
        set { customerName = value; }
    }



    public OrderInfo(int orderId, string customerName, string customerId)
    {
        this.OrderID = orderId;
        this.CustomerName = customerName;
        this.CustomerID = customerId;
    }
}

public sealed partial class MainPage : Page
{
    private ObservableCollection<OrderInfo> _orders;

    public ObservableCollection<OrderInfo> Orders
    {
        get { return _orders; }
        set { _orders = value; }
    }

    public MainPage()
    {
        this.InitializeComponent();
        _orders = new ObservableCollection<OrderInfo>();
        this.GenerateOrders();
        this.DataContext = this;
        Type mytype = Orders.FirstOrDefault().GetType();
        foreach (PropertyInfo pi in mytype.GetProperties())
        {
            dataGrid.Columns.Add(new GridTextColumn() { MappingName = pi.Name, TextAlignment = TextAlignment.Center, HeaderText = pi.Name });
        }
    }

    private void GenerateOrders()
    {
        _orders.Add(new OrderInfo(1001, "Maria Anders",  "ALFKI"));
        _orders.Add(new OrderInfo(1002, "Ana Trujillo",  "ANATR"));
    }
}
...