Question

我想通过代码设置图像位置以适应按钮（参见屏幕截图）。但我无法解决这个问题。在WinForms中它很容易，但在Silverlight中我不能只设置X＆amp; 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

通常，如果要将Image位置设置为任意，则应将Image控件托管在Canvas容器中。

但是，在您的情况下，您应该根据是否需要显示锁定来更改Button的Content元素。

<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中真正编写问题中的代码。了解如何使用数据绑定。它非常强大。只需将Buttons的IsEnabled属性绑定到公开的Property即可。

使用MVVM Light工具包执行此操作的示例（我建议您学习Silverlight / WPF开发的MVVM模式）：视图模型：

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>

在您的按钮上设置此样式（我假设您知道如何执行此操作）然后当您需要锁定按钮时，将其设置为禁用，您的图像将自动放在顶部，您的按钮将无法点击

通过代码设置图像位置

2 个答案: