Как мне получить разные цвета для частей свойства строкового объекта, привязанного к label в ItemControl?

#wpf #xaml #data-binding #viewmodel #richtext

#wpf #xaml #привязка к данным #viewmodel #richtext

Вопрос:

Это мой тип объекта:

 public class selectedLevel
{
   public string Level
    {
        get;
        set;
    }

   public string PlanetSelected
    {
        get; set;

    }
   public string houseDetails
    {
        get;
        set;
    }

    
}
 

Это мой шаблон ItemTemplate:

 
<ItemsControl x:Name="LevelDetails" Margin="-464,416,120,-484"   BorderBrush ="Black"  ItemsSource="{Binding selectedLevels}" Grid.ColumnSpan="3" HorizontalContentAlignment="Stretch">
   <ItemsControl.ItemsPanel>
      <ItemsPanelTemplate>
         <StackPanel Orientation="Horizontal"/>
      </ItemsPanelTemplate>
   </ItemsControl.ItemsPanel>
   <ItemsControl.ItemTemplate>
      <DataTemplate>
         <Grid>
            <Grid.ColumnDefinitions>
               <ColumnDefinition SharedSizeGroup="Col1" />
               <ColumnDefinition SharedSizeGroup="Col2" />
               <ColumnDefinition SharedSizeGroup="Col3" />
               <ColumnDefinition SharedSizeGroup="Col4" />
               <ColumnDefinition SharedSizeGroup="Col5" />
               <ColumnDefinition SharedSizeGroup="Col6" />
               <ColumnDefinition SharedSizeGroup="Col7" />
               <ColumnDefinition SharedSizeGroup="Col8" />
               <ColumnDefinition SharedSizeGroup="Col9" />
               <ColumnDefinition SharedSizeGroup="Col10"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
               <RowDefinition SharedSizeGroup="Row1"/>
               <RowDefinition SharedSizeGroup="Row2"/>
               <RowDefinition SharedSizeGroup="Row3"/>
            </Grid.RowDefinitions>
            <Label x:Name="LevelName" Grid.Row="0"  Content="{Binding Level}" HorizontalContentAlignment="Center" FontWeight="Bold" FontSize="16" BorderBrush="Black" BorderThickness="1" Background="{x:Null}"/>
            <Label x:Name="PlanetName" Grid.Row="1" Content="{Binding PlanetSelected}" FontSize="14" Foreground="Red" BorderBrush="Black" FontWeight="Bold" HorizontalContentAlignment="Center" BorderThickness="1" />
            <Label x:Name="LevelDetails" Grid.Row="2" HorizontalContentAlignment="Center" Content="{Binding houseDetails}" FontSize="14" BorderBrush="Black" FontWeight="Bold" BorderThickness="1" />
         </Grid>
      </DataTemplate>
   </ItemsControl.ItemTemplate>
</ItemsControl>

 

Пользовательский элемент управления связан с объектом с наблюдаемой коллекцией типа selectedLevel (показано вверху).

Я добавляю свойства SelectedLevels в модель представления следующим образом:

 selectedLevels.Add(new selectedLevel
{
    Level = "Mahadasha",
    PlanetSelected = Mahadashas[0].rulerName,
    houseDetails =  indicesList[0]     ", "   indicesList[1]   ", "   indicesList[2]
                    
});
       
 

Я пытаюсь получить разные цвета для indicesList[0] , indicesList[1] и indicesList[2] в 3-й метке, которая связана с houseDetails , но я могу изменить только полный цвет текста, а не его часть.

Я здесь совершенно потерялся. Могу ли я получить некоторую помощь в том, как установить разные цвета для частей строки?

Комментарии:

1. Вы уже показываете три свойства с разным передним планом. Кажется простым разделить детали дома на три объекта, чтобы всего их было пять. Затем используйте горизонтальную панель стека в ItemTemplate, чтобы отобразить три текстовых блока для элементов houseDetails. Или один текстовый блок с тремя прогонами. Для отображения текста обычно следует использовать TextBlock вместо Label .

2. цвета не являются фиксированными для первого, второго или третьего индекса. Они тоже меняются, основываясь на логике.

3. Затем добавьте еще три свойства для цветов.

4. И как мне привязать цвет переднего плана?

5. Свойство color должно быть строковым или цветовым типом?

Ответ №1:

Это просто, сначала вам нужно разделить houseDetails свойство на 3 строки, что-то похожее на это:

 public class selectedLevel
{
   public string Level { get; set; }

   public string PlanetSelected { get; set; }

   public string houseDetails1 { get; set; }
   public string houseDetails2 { get; set; }
   public string houseDetails3 { get; set; }
}
 

Затем вы можете использовать a TextBlock , обернутый a Border вместо третьего Label , и использовать прогоны внутри него, чтобы выбрать другой цвет для каждого из них и привязать их к соответствующим свойствам:

 <Border HorizontalAlignment="Center" BorderBrush="Black" BorderThickness="1">
    <TextBlock x:Name="LevelDetails" Grid.Row="2" FontSize="14" FontWeight="Bold">
        <Run Text="{Binding houseDetails1}" Foreground="Red"/>,
        <Run Text="{Binding houseDetails2}" Foreground="Green"/>,
        <Run Text="{Binding houseDetails3}" Foreground="Blue"/>
    </TextBlock>
</Border>

 

А затем в модели представления:

 selectedLevels.Add(new selectedLevel
{
    Level = "Mahadasha",
    PlanetSelected = Mahadashas[0].rulerName,
    houseDetails1 =  indicesList[0],
    houseDetails2 =  indicesList[1],
    houseDetails3 =  indicesList[2]                   
});
 

Комментарии:

1. Проблема с этим решением заключается в том, что оно имеет фиксированные цвета. Я хочу, чтобы цвета задавались динамически на основе логики.

2. Добавьте свойства в модель представления для каждого цвета, а затем привяжите их, если вы не хотите использовать a SolidColorBrush в своей модели представления, вы можете создать преобразователь значений для возврата цветов на основе значений, предоставляемых свойствами. Для понимания этого требуется немного исследований, но, к счастью, это просто решить.