Отображение сообщений при наведении мыши на WPF - PullRequest
0 голосов
/ 24 ноября 2018

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

Проблемы, с которыми я сталкиваюсь, в том, что я даже не вижу события парения для контроля.вот мой код:

<UserControl x:Class="Baileys.CustomChartControl"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:Baileys"
         mc:Ignorable="d" 
         d:DesignHeight="81.855" Loaded ="UserControl_Loaded" MouseDoubleClick="UserControl_DoubleClick"  MouseDown="UserControl_MouseDown"  Width="759.405" >
<Grid x:Name="grid" Background="Transparent" Margin="0,0,-368,-23">
    <Canvas x:Name="canvas">
        <Image Source ="C:\Users\bboone\Pictures\note1.jpg" HorizontalAlignment="Left" Height="80" Margin="10,0,0,0" VerticalAlignment="Top" Width="67"/>
        <Line x:Name="xAxis" X1="0" Y1="80" X2="754" Y2="80" Margin="5,0,210,-5"
          Stroke="Black" StrokeThickness="2"/>
        <Line x:Name="YAxis" X1="0" Y1="0" X2="0" Y2="80" Margin="5,0,0,-4.8"            
          Stroke="Black" StrokeThickness="2" Grid.RowSpan="3"/>
        <Line x:Name="xAxis1" X1="0" Y1="0" X2="754" Y2="0" Margin="5,0,71,-4.8"
          Stroke="Black" StrokeThickness="2" Grid.RowSpan="3"/>
        <Line x:Name="xAxis2" X1="0" Y1="20" X2="754" Y2="20" Margin="5,0,71,-4.8"
          Stroke="Black" StrokeThickness="2" Grid.RowSpan="3"/>
        <Line x:Name="xAxis3" X1="0" Y1="40" X2="754" Y2="40" Margin="5,0,71,-4.8"
          Stroke="Black" StrokeThickness="2" Grid.RowSpan="3"/>
        <Line x:Name="xAxis4" X1="0" Y1="60" X2="754" Y2="60" Margin="5,0,71,-4.8"
          Stroke="Black" StrokeThickness="2" Grid.RowSpan="3"/>
        <Line x:Name="xAxis5" X1="0" Y1="20" X2="754" Y2="20" Margin="5,0,71,-4.8"
          Stroke="Black" StrokeThickness="2" Grid.RowSpan="3"/>
        <Line x:Name="YAxis2" X1="754" Y1="0" X2="754" Y2="80" Margin="-5,0,10,-4.8"
          Stroke="Black" StrokeThickness="2" Grid.RowSpan="3"/>
        <Line x:Name="YAxis3" X1="748" Y1="0" X2="748" Y2="80" Margin="10,0,-6,-4.8"
          Stroke="Black" StrokeThickness="2" Grid.RowSpan="3"/>
    </Canvas>

</Grid>

IDk почему, но нет мыши.Вот мой код для создания эллипса:

  private void WholeNote(Point circlePoints)
    {
        int x = (int)(circlePoints.X + circlePoints.Y);
        double cubePanelSize = Math.Min(this.Width, this.Height);
        double innerSize = cubePanelSize / 3;
        double outerSize = cubePanelSize / 3;
        Ellipse ellipse = new Ellipse();
        ellipse.Height = outerSize / 2; 
        ellipse.Width = outerSize / 2;
        ellipse.Fill = Brushes.Gray;
        ellipse.StrokeThickness = 3;


        Canvas.SetTop(ellipse, circlePoints.Y);
        Canvas.SetLeft(ellipse, circlePoints.X);
        locations.Add(canvas.Children.Add(ellipse));
       DoubleAnimation ani = new DoubleAnimation
        {
            From = 0,
            To = ellipse.Width,// Convert.ToDouble(i),
            Duration = new TimeSpan(0, 0, 2)
        };
        //Add animation 
        ani.FillBehavior = FillBehavior.HoldEnd;
        ellipse.BeginAnimation(HeightProperty, ani);
        ellipse.Effect = new DropShadowEffect
        {
            Color = new Color { A = 1, R = 0, G = 139, B = 139 },
            Direction = 45,
            ShadowDepth = 10,
            Opacity = 0.8,
            BlurRadius = 10
        };


    }

, поэтому, когда пользователь нажимает на график, он создает эллипс

, поэтому кто-нибудь может мне помочь?

1 Ответ

0 голосов
/ 24 ноября 2018

В целом, это своего рода большая задача, которую нужно объяснить в одном вопросе, и, вероятно, она не совсем соответствует ожидаемому формату SO.В любом случае, это своего рода молния.

То, что вы хотите добавить (эллипс), это не просто эллипс, верно.Вы хотите, чтобы это делало что-то вроде наведения мыши.Поэтому включите его функциональность в пользовательский контроль.

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

Если вы добавляете кучу из них, то какое-то управление элементами является лучшимсписка кандидатов.потому что это подготовлено, чтобы взять коллекцию и шаблон ее в вещи.Будь то табулирование, выпадающий список, список данных или сам элемент управления.Список в itemssource> templated> UI out.Но эти вещи не просто складываются одна за другой, поэтому стандартная панель стека, которая есть в элементе управления элементами, не то, что вам нужно.

Создайте элемент как панель, и вы сможете затем позиционировать свои элементы управления.

Если я покажу вам что-то, шаблонизирующее данные в пользовательском интерфейсе, то это должно дать вам представление о том, о чем я здесь говорю:

https://1drv.ms/u/s!AmPvL3r385QhgooJ94uO6PopIDs4lQ

Эта вещь работает с фиксированнойКоллекция и делает различные шаблоны из разных типов viewmodel.Для этого вам нужен только один usercontrol и одна viewmodel с открытыми свойствами Top и Left.Назовите этот последний EllipseVM.

Затем вы обрабатываете щелчки, определяете местоположение этого щелчка и передаете его в окно, модель представления создает эти EllipseVM и устанавливает свойства Top и Left.

Еще одновещь.Вставьте путь, который является эллипсгеометрией на холсте, и он центрирован вокруг верхнего левого угла этого холста.Таким образом, вам не нужно делать какие-либо расчеты смещения.Я использую это, чтобы расположить точку на линии следующим образом: enter image description here

Например:

      <Path  
            Height="7"
            Width="7"
            Fill="White"
            Stroke="Black"
            StrokeThickness="1">
                <Path.Data>
                    <EllipseGeometry 
                        RadiusX="2.5" 
                        RadiusY="2.5"
                                   />
                </Path.Data>
            </Path>
</UserControl>

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

...