Question

我有一个我在Silverlight中开发的图像编辑器，它在一个画布上有多个文本和图像元素，可以拖动等等。我需要用户反馈，以便在用户点击时突出显示所选元素如果单击另一个元素，则突出显示另一个元素。我想我应该用元素周围的虚线边框来做这个，但我不知道它是否可能。

以下是与元素相关的代码 -

Project.cs

namespace ImageEditor.Client.BLL
{
 public class Project : INotifyPropertyChanged
   {
    private int numberOfElements;

    #region Properties

    private ObservableCollection<FrameworkElement> elements;
    public ObservableCollection<FrameworkElement> Elements
    {
        get { return elements; }
        set
        {
            elements = value;
            NotifyPropertyChanged("Elements");
        }
    }


    private FrameworkElement selectedElement;
    public FrameworkElement SelectedElement
    {
        get { return selectedElement; }
        set
        {
            selectedElement = value;
            NotifyPropertyChanged("SelectedElement");

        }
    }


    private TextBlock selectedTextElement;
    public TextBlock SelectedTextElement
    {
        get { return selectedTextElement; }
        set
        {
            selectedTextElement = value;
            NotifyPropertyChanged("SelectedTextElement");
        }
    }

    private Image selectedImageElement;
    public Image SelectedImageElement
    {
        get { return selectedImageElement; }
        set
        {
            selectedImageElement = value;
            NotifyPropertyChanged("SelectedImageElement");
        }
    }

    #endregion


    #region Methods

    private void AddTextElement(object param)
    {
        TextBlock textBlock = new TextBlock();
        textBlock.Text = "New Text";
        textBlock.Foreground = new SolidColorBrush(Colors.Gray);
        textBlock.FontSize = 25;
        textBlock.FontFamily = new FontFamily("Arial");
        textBlock.Cursor = Cursors.Hand;
        textBlock.Tag = null;

        AddDraggingBehavior(textBlock);
        textBlock.MouseLeftButtonUp += element_MouseLeftButtonUp;

        this.Elements.Add(textBlock);
        numberOfElements++;

        this.SelectedElement = textBlock;
        this.selectedTextElement = textBlock;
    }

    private BitmapImage GetImageFromLocalMachine(out bool? success, out string fileName)
    {
        OpenFileDialog dialog = new OpenFileDialog()
        {
            Filter = "Image Files (*.bmp;*.jpg;*.gif;*.png;)|*.bmp;*.jpg;*.gif;*.png;",
            Multiselect = false
        };

        success = dialog.ShowDialog();
        if (success == true)
        {
            fileName = dialog.File.Name;
            FileStream stream = dialog.File.OpenRead();
            byte[] data;

            BitmapImage imageSource = new BitmapImage();
            using (FileStream fileStream = stream)
            {
                imageSource.SetSource(fileStream);
                data = new byte[fileStream.Length];
                fileStream.Read(data, 0, data.Length);
                fileStream.Flush();
                fileStream.Close();
            }

            return imageSource;
        }
        else
        {
            fileName = string.Empty;
            return new BitmapImage();
        }
    }

    private void AddImageElement(object param)
    {
        bool? gotImage;
        string fileName;
        BitmapImage imageSource = GetImageFromLocalMachine(out gotImage, out fileName);

        if (gotImage == true)
        {
            Image image = new Image();
            image.Name = fileName;
            image.Source = imageSource;
            image.Height = imageSource.PixelHeight;
            image.Width = imageSource.PixelWidth;
            image.MaxHeight = imageSource.PixelHeight;
            image.MaxWidth = imageSource.PixelWidth;
            image.Cursor = Cursors.Hand;
            image.Tag = null;


            AddDraggingBehavior(image);
            image.MouseLeftButtonUp += element_MouseLeftButtonUp;

            this.Elements.Add(image);
            numberOfElements++;

            this.SelectedElement = image;
            this.SelectedImageElement = image;
        }
    }


    private void OrderElements()
    {
        var elList = (from element in this.Elements
                      orderby element.GetValue(Canvas.ZIndexProperty)
                      select element).ToList<FrameworkElement>();

        for (int i = 0; i < elList.Count; i++)
        {
            FrameworkElement fe = elList[i];
            fe.SetValue(Canvas.ZIndexProperty, i);
        }

        this.Elements = new ObservableCollection<FrameworkElement>(elList);
    }

    public void element_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
    {
        this.SelectedElement = sender as FrameworkElement;
        if (sender is TextBlock)
        {
            this.SelectedTextElement = sender as TextBlock;
            FadeOut(this.SelectedTextElement);
        }
        else if (sender is Image)
        {
            this.SelectedImageElement = sender as Image;
            FadeOut(this.SelectedImageElement);
        }

    }
    #endregion

不仅仅需要，但你很清楚这一切是如何运作的。我该怎么办呢？我对silverlight来说还是个新手

编辑：

这是我对DashBorder方法的开始尝试，其中我正在尝试使矩形与所选元素的尺寸相同，这将围绕元素

public static void DashBorder(FrameworkElement element)
    {
        Rectangle rect = new Rectangle();
        rect.Stroke = new SolidColorBrush(Colors.Black);
        rect.Width=element.Width;
        rect.Height=element.Height;
        rect.StrokeDashArray = new DoubleCollection() { 2, 2 };

    }

似乎什么也不做，反正不是我想做的事情。是否无法直接在FrameworkElement上创建破折号边框？

Answer 1

我不知道怎么做，but google does。

您可以使用StrokeDashArray来达到预期的效果，例如：

<Rectangle Canvas.Left="10" Canvas.Top="10" Width="100" Height="100" Stroke="Black" StrokeDashArray="10, 2"/>

StrokeDashArray中的第一个数字是短划线的长度，即第二个数字是间隙的长度。你可以重复破折号对生成不同的模式。

编辑：

要在代码中执行此操作，请创建一个矩形并将其设置为StrokeDashArray属性（未经测试的代码）：

Rectangle rect = new Rectangle();
rect.StrokeThickness = 1;
double[] dashArray = new double[2];
dashArray[0] = 2;
dashArray[1] = 4;
rect.StrokeDashArray = dashArray;

Silverlight中是否可以选择文本/图像元素周围的虚线边框？

1 个答案: