2015-01-06 3 views
4

Это мой xaml structureКак изменить фон в текстовом блоке?

<stackpanel> 
    <textblock Text="A"></textblock> 
    <textblock Text="B"></textblock> 
</stackpanel> 

Stackpanel, это может быть зациклена для создания более же структуры.

Как изменить цвет фона texblock при нажатии на него?

UPDATE: I just want change on xaml file not using C#.

По умолчанию я имеет желтый цвет, но когда я нажимаю на TextBlock, его фон изменится на синий.

UPDATE 2: Если щелкнуть A, то A изменится на синий, пока не нажмем на другое.

деталь:

  1. я нажимаю (A is yellow), A изменится на синий цвет ==> А синий

  2. я нажимаю B (B is yellow and A is blue), B изменится на синий цвет и А изменится быть желтым.

UPDATE 3: Как насчет этого?

<stackpanel> 
     <textblock Text="A"></textblock> 
</stackpanel> 

<stackpanel> 
     <textblock Text="A"></textblock> 
</stackpanel> 
<stackpanel> 
     <textblock Text="A"></textblock> 
</stackpanel> 

Вопрос в том же выше

Спасибо!

+0

для этого вам потребуется специальный контроль. логика, в которой вы нуждаетесь, не может быть рассмотрена внутри самого элемента управления, но зависит от других элементов управления, поэтому чистым решением xaml невозможно – Dbl

+0

@ Andreas Müller Как насчет ** UPDATE 3 **? – GSP

+0

что об этом? мой ответ все равно должен работать и на этот случай. – Dbl

ответ

1

Использование EventTrigger и цвет анимации вы можете изменить цвет фона TextBlock цвета на MouseDown или MouseLeave


XAML код

<StackPanel> 
    <StackPanel.Resources> 
     <Style TargetType="TextBlock"> 
      <Style.Triggers> 
       <EventTrigger RoutedEvent="MouseDown"> 
        <BeginStoryboard> 
         <Storyboard> 
          <ColorAnimation Storyboard.TargetProperty="Background.Color" From="Yellow" To="Blue" Duration="0:0:0.1"></ColorAnimation> 
         </Storyboard> 
        </BeginStoryboard> 
       </EventTrigger> 
       <EventTrigger RoutedEvent="MouseLeave"> 
        <BeginStoryboard> 
         <Storyboard> 
          <ColorAnimation Storyboard.TargetProperty="Background.Color" From="Blue" To="Yellow" Duration="0:0:0.1"></ColorAnimation> 
         </Storyboard> 
        </BeginStoryboard> 
       </EventTrigger> 
      </Style.Triggers> 
     </Style> 
    </StackPanel.Resources> 
    <TextBlock Text="A" Background="Yellow"></TextBlock> 
    <TextBlock Text="B" Background="Yellow"></TextBlock> 
</StackPanel> 

Update

Использование TextBox со свойством IsReadOnly = True вместо TextBlock.

<StackPanel> 
    <StackPanel.Resources> 
     <Style TargetType="TextBox"> 
      <Setter Property="Background" Value="Yellow"></Setter> 
      <Setter Property="BorderThickness" Value="0"></Setter> 
      <Setter Property="IsReadOnly" Value="True"></Setter> 
      <Style.Triggers> 
       <EventTrigger RoutedEvent="TextBox.GotFocus"> 
        <BeginStoryboard> 
         <Storyboard> 
          <ColorAnimation Storyboard.TargetProperty="Background.Color" From="Yellow" To="Blue" Duration="0:0:0.1"></ColorAnimation> 
         </Storyboard> 
        </BeginStoryboard> 
       </EventTrigger> 
       <EventTrigger RoutedEvent="TextBox.LostFocus"> 
        <BeginStoryboard> 
         <Storyboard> 
          <ColorAnimation Storyboard.TargetProperty="Background.Color" From="Blue" To="Yellow" Duration="0:0:0.1"></ColorAnimation> 
         </Storyboard> 
        </BeginStoryboard> 
       </EventTrigger> 
      </Style.Triggers> 
     </Style> 
    </StackPanel.Resources> 
    <TextBox Text="A"></TextBox> 
    <TextBox Text="A"></TextBox> 
</StackPanel> 
+0

Спасибо @Heena Patil, но когда 'MouseLeave' поднимет цвет, исчезнет. Я хочу: Когда я нажимаю A (Желтый), A изменился на синий, и он будет синим, пока я не нажму на B. Затем B (желтый) изменится на синий. – GSP

+0

Если я удаляю ' ...', фон TextBlock всегда имеет синий цвет после щелчка по нему. – GSP

+1

@ GSP plesae см. Обновление.sorry для позднего ответа. –

2

Программные:

textBlock1.Background = new SolidColorBrush(Colors.Yellow); 

В XAML:

<TextBlock Name="textBlock1"> 
    <TextBlock.Background> 
     <SolidColorBrush Color="Yellow" /> 
    </TextBlock.Background> 
</TextBlock> 

Чтобы изменить цвет фона при нажатии на TextBlock, вы должны использовать собственный стиль с триггерами. Это не сложно, если вы будете искать или спрашивать об использовании стилей и триггеров. Вы определенно не должны использовать C# для этого в шаблонах проектирования XAML.

+0

Спасибо @ Dmitrij A. Я ищу другой источник. – GSP

+0

мой VS сломан, поэтому я не могу опубликовать образец триггеров сейчас. – Croll

0
<TextBlock Text="Hello, styled world!" FontSize="28" HorizontalAlignment="Center" VerticalAlignment="Center"> 
       <TextBlock.Style> 
        <Style TargetType="TextBlock"> 
         <Setter Property="Background" Value="Yellow"></Setter> 
         <Style.Triggers> 
          <Trigger Property="IsMouseOver" Value="True"> 
           <Setter Property="Background" Value="Blue" /> 
           <Setter Property="TextDecorations" Value="Underline" /> 
          </Trigger> 
         </Style.Triggers> 
        </Style> 
       </TextBlock.Style> 
      </TextBlock> 
+0

Спасибо @Dhru 'soni, но я работаю так же с 'Heena Patil' – GSP

0

Это willbe решение вашей проблемы, скорее всего. Поскольку я указал, что решение xaml не будет возможным из-за характера вашего требования, что вы хотите, чтобы один элемент управления зависел от вариации других элементов управления.

Вы можете поиграть с остальной частью, конечно.

public class RadioTextblock : TextBlock 
{ 
    static RadioTextblock() 
    { 
     DefaultStyleKeyProperty.OverrideMetadata(typeof(RadioTextblock), new FrameworkPropertyMetadata(typeof(RadioTextblock))); 
    } 

    public static readonly DependencyProperty GroupProperty = DependencyProperty.Register(
     "Group", typeof (string), typeof (RadioTextblock), new PropertyMetadata(string.Empty)); 

    public string Group 
    { 
     get { return (string) GetValue(GroupProperty); } 
     set { SetValue(GroupProperty, value); } 
    } 

    public static readonly DependencyProperty ActiveColorProperty = DependencyProperty.Register(
     "ActiveColor", typeof (Brush), typeof (RadioTextblock), new PropertyMetadata(default(Brush))); 

    public Brush ActiveColor 
    { 
     get { return (Brush) GetValue(ActiveColorProperty); } 
     set { SetValue(ActiveColorProperty, value); } 
    } 

    public static readonly DependencyProperty RestorationColorProperty = DependencyProperty.Register(
     "RestorationColor", typeof (Brush), typeof (RadioTextblock), new PropertyMetadata(default(Brush))); 

    public Brush RestorationColor 
    { 
     get { return (Brush) GetValue(RestorationColorProperty); } 
     set { SetValue(RestorationColorProperty, value); } 
    } 

    protected override void OnInitialized(EventArgs e) 
    { 
     base.OnInitialized(e); 
     // there may be a better hook for this. but i'm not writing custom controls that often. anything after styles are applied should be good 
     RestorationColor = Background; 
    } 

    protected override void OnPreviewMouseDown(MouseButtonEventArgs e) 
    { 
     RestoreOtherBackgrounds(this); 
     base.OnPreviewMouseDown(e); 
    } 

    private void RestoreOtherBackgrounds(RadioTextblock radioTextblock) 
    { 
     var topParent = GetTopMostParent(radioTextblock); 
     var controlsWithGroup = GetChildrenRecursive<RadioTextblock>(topParent).ToLookup(d => (string)d.GetValue(GroupProperty)); 
     var similar = controlsWithGroup[radioTextblock.Group]; 
     foreach (var match in similar) 
     { 
      if (match == radioTextblock) 
      { 
       match.Background = ActiveColor; 
      } 
      else 
      { 
       match.Background = match.RestorationColor; 
      } 
     } 
    } 

    private DependencyObject GetTopMostParent(RadioTextblock radioTextblock) 
    { 
     DependencyObject current = radioTextblock; 
     while (current != null) 
     { 
      var cParent = VisualTreeHelper.GetParent(current); 
      if (cParent == null || cParent == current) 
       break; 

      current = cParent; 
     } 

     return current; 
    } 

    private IEnumerable<T> GetChildrenRecursive<T>(DependencyObject current) where T : DependencyObject 
    { 
     T casted; 
     var childCount = VisualTreeHelper.GetChildrenCount(current); 
     for (int i = 0; i < childCount; i++) 
     { 
      var currentChild = VisualTreeHelper.GetChild(current, i); 
      casted = currentChild as T; 
      if(casted != null) 
       yield return casted; 

      foreach (var subChild in GetChildrenRecursive<T>(currentChild)) 
      { 
       if (subChild != null) 
        yield return casted; 
      } 
     } 
    } 
} 
+0

Спасибо @ Andreas Müller, но я просто хочу изменить файл xaml. – GSP

+0

это не о желании чего-то. речь идет о том, как платформа позволяет ее разрабатывать. то, что вы хотите, невозможно с помощью только xaml – Dbl

+0

stackpanel находится под древовидной структурой. Таким образом, я могу изменить фоновый элемент treeview, после чего стекпанель изменилась (stackpanel - это элемент). Но ** AAA ** - фон элемента, A ** AA ** - фон stackpanel (я хочу это представление). – GSP

0

Измените XAML структуру, как следовать за в

xmlns:local="clr-namespace:your_assembly_Name" 
..... 
<StackPanel> 
    <StackPanel.Resources> 
     <local:BackgroundConverter x:Key="backgroundConverter"/> 
     <Style TargetType="TextBlock"> 
      <EventSetter Event="MouseDown" Handler="TextBlockMouseDownEvent" /> 
      <Setter Property="Background"> 
       <Setter.Value> 
        <MultiBinding Converter="{StaticResource backgroundConverter}"> 
         <Binding Path="Name" RelativeSource="{RelativeSource Self}"/> 
         <Binding Path="SelectedTextBlockName"/> 
        </MultiBinding> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </StackPanel.Resources> 
    <TextBlock x:Name="text1" Text="Header"/> 
    <TextBlock x:Name="text2" Text="Header"/> 
    <TextBlock x:Name="text3" Text="Header"/> 
    <TextBlock x:Name="text4" Text="Header"/> 
</StackPanel> 

Используйте следующие IMultiValueConverter и добавить TextBlockMouseDownEvent обработчика событий, а также один DependencyProperty в вашем коде позади.

////DependencyProperty 
public string SelectedTextBlockName 
{ 
    get { return (string)GetValue(SelectedTextBlockNameProperty); } 
    set { SetValue(SelectedTextBlockNameProperty, value); } 
} 

// Using a DependencyProperty as the backing store for SelectedTextBlock. This enables animation, styling, binding, etc... 
public static readonly DependencyProperty SelectedTextBlockNameProperty = 
    DependencyProperty.Register("SelectedTextBlockName", typeof(string), typeof(Class_Name), new PropertyMetadata(null)); 

....... 

private void TextBlockMouseDownEvent(object sender, MouseButtonEventArgs e) 
{ 
    TextBlock txtBlock = sender as TextBlock; 
    if (txtBlock != null) 
    { 
     SelectedTextBlockName = txtBlock.Name; 
    } 
} 

....... 

public class BackgroundConverter : IMultiValueConverter 
{ 
    /// <summary> 
    /// Values[0] = Name of TextBlock 
    /// values[1] = SelectedTextBlockName 
    /// If matches then it is selected 
    /// </summary> 
    public object Convert(object[] values, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
    { 
     if (values[0] != null && values[1] != null && values[0].ToString() == values[1].ToString()) 
      return new SolidColorBrush(Colors.Blue); 
     return new SolidColorBrush(Colors.White); 
    } 

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, System.Globalization.CultureInfo culture) 
    { 
     throw new NotImplementedException(); 
    } 
} 

Если вы хотите установить по умолчанию SelectedTextBlock затем просто установить имя TextBlock, который вы хотите, как по умолчанию будет выбран. вот так:

SelectedTextBlockName = "text1"; 
+0

Большое вам спасибо. Я также хочу изменить файл xaml. И я нашел для меня ответ: это пост '** Хеена Патил **' – GSP

Смежные вопросы