Настройка положения изображения по коду

Question

Я хочу установить положение изображения по коду, чтобы он поместился на кнопку (см. Снимок экрана). Но я не могу это решить. В WinForms это было просто, но в Silverlight я не могу просто установить X & Y, по-видимому.

public void LockControls() 
    { 
     int LockIndex = 0; 

     DependencyObject myUserControl = LayoutRoot; 
     foreach (var button in FindAll<Button>(myUserControl)) 
     { 
      if (button.Tag != null) 
      { 
       Image LockedIcon = new Image(); 

       LockedIcon.Width = 20; 
       LockedIcon.Height = 20; 
       //LockedIcon.Margin = new Thickness(0,0,0,0); 


       LockedIcon.Source = new BitmapImage(new Uri("images/LockedIconx20alpha.png", UriKind.Relative)); 
       LockedIcon.Name = "Lockie" + LockIndex; 

       LayoutRoot.Children.Add(LockedIcon); 
       button.Tag = "Locked" + LockIndex; 
       LockIndex++; 

      } 
     } 

    } 

http://puu.sh/wS7g скриншот показывает положение качества изображения (locck), но я не понимаю, как текущее положение создается. Просто чтобы прояснить, я хочу, чтобы установить положение на кнопку «0%»

Спасибо заранее, Джек

Answer 1

В общем, если вы хотите, чтобы установить положение изображения произвольно, вы должны провести контроль изображения в контейнере Canvas.

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

<UserControl DataContext="{Binding Main, Source={StaticResource Locator}} 

     <Grid.Resources> 
      <converters:VisibilityConverter x:Key="VisibilityConverter" /> 
     </Grid.Resources> 

     <Button Width="100" Height="23" IsEnabled="{Binding IsControlsEnabled}"> 
      <Button.Content> 
       <StackPanel Orientation="Horizontal"> 
        <Image Source="lock.png" Margin="10,0,10,0" 
          Visibility="{Binding IsControlsEnabled, Converter={StaticResource VisibilityConverter}}"/> 
        <TextBlock Text="Button"/> 
       </StackPanel> 
      </Button.Content> 
     </Button> 

Кроме того, вы не должны писать код, который у вас есть, в Silverlight. Узнайте, как использовать привязку данных. Это очень мощно. Просто привяжите свойство IsEnabled ваших кнопок к выставленному свойству.

Пример делать это с помощью инструментария MVVM Light (я рекомендую вам изучить шаблон MVVM для разработки Silverlight/WPF): The View Model:

public class MainViewModel : ViewModelBase 
{ 

    private bool isControlsEnabled; 
    public bool IsControlsEnabled 
    { 
    get { return isControlsEnabled; } 
    set 
    { 
     if (IsControlsEnabled.Equals(value)) return; 
     isControlsEnabled = value; 
     RaisePropertyChanged(() => IsControlsEnabled); 
    } 
    } 
} 

видимость Преобразователь:

public class VisibilityConverter : IValueConverter 
    { 
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
    { 
     return (bool)value ? Visibility.Collapsed : Visibility.Visible; 
    } 

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

И тогда вы можете просто включить/отключить все элементы управления, которые связаны, например, с помощью CheckBox:

<CheckBox IsChecked="{Binding IsControlsEnabled, Mode=TwoWay}" Content="Controls are enabled"/> 

Answer 2

Это не правильный способ сделать. Если я правильно понимаю, вы хотите, чтобы супер-наложить изображение поверх кнопки, чтобы пользователь не мог его использовать. Это не сработает.

Для этого вы должны понимать layout system of Silverlight: элементы управления устанавливаются двигателем во время измерения и организуют события. При попытке наложения такого изображения вам потребуется подключить эти события или получить класс Button и переопределить метод Arrange для наложения вашего изображения.

Но это не помешает пользователю использовать кнопку, потому что сама кнопка не отключена, и можно просто «вставить» в нее и активировать ее.

Вместо этого я предлагаю вам использовать стиль для кнопки и переопределить, скажем, отключенное состояние, чтобы наложить заблокированное изображение.The button style is described here. Все, что вам нужно сделать, это заменить:

<Rectangle x:Name="DisabledVisualElement" RadiusX="3" RadiusY="3" Fill="#FFFFFFFF" Opacity="0" IsHitTestVisible="false" /> 

по

<Image x:Name="DisabledVisualElement" IsHitTestVisible="false" Opacity="0" Width="20" Height="20" Source="images/LockedIconx20alpha.png" /> 

и установите непрозрачность в следующее 1:

<vsm:VisualState x:Name="Disabled"> 
     <Storyboard> 
      <DoubleAnimation Duration="0" Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity" To=".55"/> 
     </Storyboard> 
    </vsm:VisualState> 

Установить этот стиль на кнопке (I предположим, что вы знаете, как это сделать), тогда, когда вам нужно заблокировать вашу кнопку, установите ее на отключенную, и ваше изображение будет автоматически укладываться сверху, и ваша кнопка будет недоступна.