Как создать интерактивный тур WPF для приложения

Я не знаю, существует ли конкретный инструмент для вашей цели, но, на мой взгляд, вы можете написать свой код самостоятельно. Это не так сложно.

Вы можете получить идеи из этого простого примера. Я использовал < Window x : Class = "WpfApplication1.MainWindow" Name = "win" xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns : x = "http: // schemas .microsoft.com / winfx / 2006 / xaml " xmlns : sys = " clr-namespace: System; assembly = mscorlib " xmlns : ed = " http://schemas.microsoft.com/expression/2010/drawing " Title = " MainWindow " Высота = "600" Width = "600" > < Grid > < StackPanel Margin = "0, 200, 200, 0" > < TextBox Margin = "10" Name = "TextBox" /> < CheckBox Content = "Flag" Margin = " 10 " Name = " CheckBox " Width = " 70 " HorizontalAlignment = " Left " /> < Button Content = " Click Me " Margin = " 10 " Name = " Button " /> < ComboBox Margin = " 10 " Name = " ComboBox " > < sys : String > Пункт 1 </ sys : String > < sys : String > Пункт 2 </ sys : String > < sys : String > Пункт 3 </ sys : String > </ ComboBox > < Button Name = " Start» Content = "Start Tour" Margin = "10" Нажмите = "StartTour" /> </ StackPanel > < изд : Выноска Имя = "Выноска" Fill = "светло - желтого" Ширина = "200" высота = "100" HorizontalAlignment = «Left» VerticalAlignment = «Top» CalloutStyle = «Oval» Stroke = «Черный» Видимость = «Скрытая» панель . ZIndex = "100" > < StackPanel Orientation = "Vertical" > < TextBlock Name = "CalloutMessage" Margin = "5" TextWrapping = "Wrap" /> < StackPanel Orientation = "Horizontal" HorizontalAlignment = "Center" > < Button Content = «Ok» Click = «Ok» Margin = «1» /> < Button Content = «Cancel» Click = «Cancel» Margin = «1» /> </ StackPanel > </ StackPanel > </ ed : Выноска > </ Grid > </ Window > (v = выражение.40) .aspx "rel =" nofollow "> Контроль CallOut - вы можете найти его вбиблиотеке Microsoft.Expression.Drawing ).

Теперь посмотрим код XAML:

CallOut

Я добавил несколько элементов управления и кнопку для начала тура. Вы CallOutтоже можете найти . Он будет перемещен, чтобы «объяснить» другие элементы управления.

Теперь, в коде, мы имеем:

using System;
using System.Collections.Specialized;
using System.Windows;
using System.Windows.Media;

namespace WpfApplication1
{
    public partial class MainWindow : Window
    {
        private NameValueCollection tourData = new NameValueCollection();
        private int currentIndex;

        public MainWindow()
        {
            InitializeComponent();

            tourData.Add("TextBox", "This is a TextBox");
            tourData.Add("Button", "This is a Button. You can click it");
            tourData.Add("CheckBox", "This is a CheckBox");
            tourData.Add("ComboBox", "This is a ComboBox. You can select an item");

        }

        private void MoveCallout(FrameworkElement element, string message)
        {
            GeneralTransform generaTransform = element.TransformToAncestor(this);
            Point point = generaTransform.Transform(new Point(0, 0));

            double x = point.X + element.ActualWidth + 4;
            double y = point.Y + element.ActualHeight + 4;

            CalloutMessage.Text = message;
            Callout.RenderTransform = new TranslateTransform(x, y);
        }

        private void StartTour(object sender, EventArgs args)
        {
            currentIndex = 0;
            Callout.Visibility = System.Windows.Visibility.Visible;
            Start.IsEnabled = false;

            FrameworkElement element = (FrameworkElement)FindName(tourData.GetKey(currentIndex));
            MoveCallout(element, tourData.Get(currentIndex));

            currentIndex++;
        }

        private void Ok(object sender, EventArgs args)
        {
            FrameworkElement element;
            if (currentIndex < tourData.Count)
            {
                element = (FrameworkElement)FindName(tourData.GetKey(currentIndex));
                MoveCallout(element, tourData.Get(currentIndex));

                currentIndex++;
            }
            else
            {
                Callout.Visibility = System.Windows.Visibility.Hidden;
                Start.IsEnabled = true;
            }

        }

        private void Cancel(object sender, EventArgs args)
        {
            Callout.Visibility = System.Windows.Visibility.Hidden;
            Start.IsEnabled = true;
        }
    }
}

Конечно, этот образец не совместим с MVVM. В любом случае, я думаю, это не потребует больших усилий, чтобы изменить его на MVVM.

Я надеюсь, что этот образец поможет вам и может дать вам некоторый намек на вашу работу.

Вы можете проверить Whatfix . Это инструмент, похожий на TourMyApp, но гораздо проще в использовании и обладает множеством полезных функций.

Благодаря этому вы можете легко создавать интерактивные пошаговые руководства для любого веб-приложения.

Он работает во всех веб-приложениях или на веб-сайте. Вы можете использовать редактор Whatfix для Chrome или Firefox для создания интерактивных пошаговых руководств. После создания, это пошаговые руководства можно просмотреть во всех веб-браузерах.