WPF实现轮播图

1、效果图

2、前端代码

<Window x:Class="LiveChartDemo.View.CarouselView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:LiveChartDemo.View"
        mc:Ignorable="d" Background="Transparent"
        Title="CarouselView" Height="380" Width="800">
    <Grid Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
        <StackPanel>
            <Image x:Name="CarouselViewImg1" Source="../Img\01.jpg" Stretch="UniformToFill"/>
            <!--<Image x:Name="CarouselViewImg1" Source="{Binding ImgUrl}" Stretch="UniformToFill"/>-->
        </StackPanel>
        <StackPanel Margin="0 310 0 0" Panel.ZIndex="999">
            <UniformGrid Columns="5" Background="Transparent" VerticalAlignment="Center" HorizontalAlignment="Center">
                <Border Width="15" Height="15" Background="#4FD761" Margin="5" Name="TipButton1" MouseDown="ClickButton" Tag="1"/>
                <Border Width="15" Height="15" Background="#F0AF53" Name="TipButton2" MouseDown="ClickButton" Tag="2"/>
                <Border Width="15" Height="15" Background="#F0AF53" Name="TipButton3" MouseDown="ClickButton" Tag="3"/>
                <Border Width="15" Height="15" Background="#F0AF53" Name="TipButton4" MouseDown="ClickButton" Tag="4"/>
                <Border Width="15" Height="15" Background="#F0AF53" Name="TipButton5" MouseDown="ClickButton" Tag="5"/>
            </UniformGrid>
        </StackPanel>
    </Grid>
</Window>
3、后台代码

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace LiveChartDemo.View
{
    /// <summary>
    /// CarouselView.xaml 的交互逻辑
    /// </summary>
    public partial class CarouselView : Window
    {
        private int step = 0;
        public CarouselView()
        {
           
            InitializeComponent();
            Task.Run(current);
        }
        private void current()
        {
            while (true)
            {
                if (step<5)
                {
                    step++;
                }
                else
                {
                    step = 1;
                }
                Thread.Sleep(1000);
                Application.Current.Dispatcher.Invoke(() =>
                {
                    CarouselViewImg1.Source = new BitmapImage(new Uri($@"../Img\0{step}.jpg", UriKind.Relative));
                    Color colorInit = (Color)ColorConverter.ConvertFromString("#F0AF53");
                     Color colorActive = (Color)ColorConverter.ConvertFromString("#4FD761");
                    TipButton1.Background = new SolidColorBrush(colorInit);
                    TipButton2.Background = new SolidColorBrush(colorInit);
                    TipButton3.Background = new SolidColorBrush(colorInit);
                    TipButton4.Background = new SolidColorBrush(colorInit);
                    TipButton5.Background = new SolidColorBrush(colorInit);
                    switch (step)
                    {
                        case 1:
                            TipButton1.Background = new SolidColorBrush(colorActive);
                            break;
                        case 2:
                            TipButton2.Background = new SolidColorBrush(colorActive);
                            break;
                        case 3:
                            TipButton3.Background = new SolidColorBrush(colorActive);
                            break;
                        case 4:
                            TipButton4.Background = new SolidColorBrush(colorActive);
                            break;
                        case 5:
                            TipButton5.Background = new SolidColorBrush(colorActive);
                            break;
                        default:
                            break;
                    }
                });
            }
        }
        private void ClickButton(object sender, MouseButtonEventArgs e)
        {
            var tag = (Border)sender;
            var Index = tag.Tag.ToString();
            Color colorInit = (Color)ColorConverter.ConvertFromString("#F0AF53");
            Color colorActive = (Color)ColorConverter.ConvertFromString("#4FD761");
            TipButton1.Background = new SolidColorBrush(colorInit);
            TipButton2.Background = new SolidColorBrush(colorInit);
            TipButton3.Background = new SolidColorBrush(colorInit);
            TipButton4.Background = new SolidColorBrush(colorInit);
            TipButton5.Background = new SolidColorBrush(colorInit);
            step = int.Parse(Index);
            switch (step)
            {
                case 1:
                    TipButton1.Background = new SolidColorBrush(colorActive);
                    break;
                case 2:
                    TipButton2.Background = new SolidColorBrush(colorActive);
                    break;
                case 3:
                    TipButton3.Background = new SolidColorBrush(colorActive);
                    break;
                case 4:
                    TipButton4.Background = new SolidColorBrush(colorActive);
                    break;
                case 5:
                    TipButton5.Background = new SolidColorBrush(colorActive);
                    break;
                default:
                    break;
            }
            CarouselViewImg1.Source = new BitmapImage(new Uri($@"../Img\0{Index}.jpg", UriKind.Relative));
        }
    }
}