Telerik UI for WPF?下载30天免费试用

开始

本教程将引导您创建一个包含RadCarousel并将向您展示如何:

为了本例的目的,您需要在Visual Studio中创建一个空的WPF应用程序。

添加RadCarousel到您的项目

一旦创建了一个新的WPF项目,你将需要添加对程序集的引用:

  • Telerik.Windows.Controls;

  • Telerik.Windows.Controls.Navigation;

  • Telerik.Windows.Data;

接下来,需要将RadCarousel添加到应用程序中。你可以设置它的一些基本属性,比如背景高度.请记住,您将需要定义telerik名称空间。此外,如果你想在代码背后访问它,你可以声明它的的名字属性:

例1:向应用程序添加RadGridView

<用户控件xmlns: telerik = "http://schemas.telerik.com/2008/xaml/presentation">   .

将RadCarousel绑定到自定义对象集合

为了本教程的目的,我们将创建一个new员工使用几个属性初始化:

例2:Employee类

public class Employee {public string FirstName {get;设置;}公共字符串LastName {get;设置;}公共int年龄{获取;设置;}公共字符串位置{获取;设置;}}
Public Class Employee Public Property FirstName() As String Get Return m_FirstName End Get Set m_FirstName = Value End Set End Property Private m_FirstName As String Public Property LastName() As String Get Return m_LastName End Get Set m_LastName = Value End Set End Property Private m_LastName As String Public Property Age() As Integer Get Return m_Age End Get Set m_Age = Value End Set End Property Private m_Age As Integer Public Property Position() As String Get Return m_Position End Get Setm_Position = Value结束设置结束属性私有m_Position As String结束类

此外,由于需要一些数据,我们将创建EmployeeService类,它提供静态的GetEmployees ()方法:

例3:EmployeeService类

public class EmployeeService {public static ObservableCollection GetEmployees() {ObservableCollection employees = new ObservableCollection();雇员雇员=新雇员();员工。FirstName = "Margaret";员工。姓氏=“孔雀”;员工。职位=“销售代表”;员工。年龄= 24岁; employees.Add(employee); employee = new Employee(); employee.FirstName = "Steven"; employee.LastName = "Buchanan"; employee.Position = "Sales Manager"; employee.Age = 44; employees.Add(employee); employee = new Employee(); employee.FirstName = "Michael"; employee.LastName = "Suyama"; employee.Position = "Sales Representative"; employee.Age = 33; employees.Add(employee); employee = new Employee(); employee.FirstName = "Robert"; employee.LastName = "King"; employee.Position = "Sales Representative"; employee.Age = 28; employees.Add(employee); employee = new Employee(); employee.FirstName = "Laura"; employee.LastName = "Callahan"; employee.Position = "Inside Sales Coordinator"; employee.Age = 26; employees.Add(employee); employee = new Employee(); employee.FirstName = "Anne"; employee.LastName = "Dodsworth"; employee.Position = "Sales Representative"; employee.Age = 30; employees.Add(employee); return employees; } }
公共类EmployeeService公共共享函数GetEmployees() As ObservableCollection(Of Employee) Dim employees As New ObservableCollection(Of Employee)() Dim Employee As New Employee() Employee。名字=“Margaret”员工。姓=“孔雀”的员工。职位=“销售代表”员工。年龄= 24名员工。添加(员工)员工=新员工()名员工。FirstName =“Steven”员工。姓= "布坎南"员工。职位=“销售经理”员工。年龄= 44名员工。新增(员工)员工=新员工()名员工。名字=“Michael”员工。姓=“Suyama”员工。职位=“销售代表”员工。年龄= 33名员工。新增(员工)员工=新员工()名员工。名字=“Robert”员工。姓=“国王”的员工。职位=“销售代表”员工。年龄= 28名员工。新增(员工)员工=新员工()名员工。FirstName =“Laura”员工。LastName = "Callahan" employee.Position = "Inside Sales Coordinator" employee.Age = 26 employees.Add(employee) employee = New Employee() employee.FirstName = "Anne" employee.LastName = "Dodsworth" employee.Position = "Sales Representative" employee.Age = 30 employees.Add(employee) Return employees End Function End Class

一旦所有的数据都准备好了,我们就可以设置拉德旋转木马了ItemsSource

例4:设置RadCarousel的ItemsSource

this.MyCarousel.ItemsSource = EmployeeService.GetEmployees();
Me.MyCarousel.ItemsSource = EmployeeService.GetEmployees()

运行应用程序后,您将看到以下结果:

图1:RadCarousel显示员工列表

RadCarousel显示员工列表

在RadCarousel中显示图像

一般来说,RadCarousel可以很容易地用于显示图像和导航。您所需要做的就是添加那些您想要可视化的列表例如,设置RadCarousel的ItemsSource:

例5:将RadCarousel的ItemsSource设置为一个图像列表

myImages = new List();Image myImage = new Image();模板。Source = new BitmapImage(new Uri("/Images/nature1.jpg", UriKind.Relative));模板。高度= 200; myImage.Width = 200; myImages.Add(myImage); Image myImage1 = new Image(); myImage1.Source = new BitmapImage(new Uri("/Images/nature2.jpg", UriKind.Relative)); myImage1.Height = 200; myImage1.Height = 200; myImages.Add(myImage1); Image myImage2 = new Image(); myImage2.Source = new BitmapImage(new Uri("/Images/nature15.jpg", UriKind.Relative)); myImage2.Width = 200; myImage.Height = 200; myImages.Add(myImage2); Image myImage3 = new Image(); myImage3.Source = new BitmapImage(new Uri("/Images/nature19.jpg", UriKind.Relative)); myImage3.Height = 200; myImage3.Width = 200; myImages.Add(myImage3); Image myImage4 = new Image(); myImage4.Source = new BitmapImage(new Uri("/Images/nature26.jpg", UriKind.Relative)); myImage4.Height = 200; myImage4.Width = 200; myImages.Add(myImage4); this.MyCarousel.ItemsSource = myImages;
Dim myImage As New List(Of Image)()来源=新BitmapImage(新Uri("/Images/nature1.jpg", UriKind.Relative))高度= 200 myImage。myImage . add (myImage) Dim myImage1 As New Image() myImage1. add (myImage)来源=新BitmapImage(新Uri("/Images/nature2.jpg", UriKind.Relative))myImage1. Height = 200高度= 200 myImages.Add(myImage1) Dim myImage2 As New Image() myImage2.Source = New BitmapImage(New Uri("/Images/nature15.jpg", UriKind.Relative)) myImage2.Width = 200 myImage.Height = 200 myImages.Add(myImage2) Dim myImage3 As New Image() myImage3.Source = New BitmapImage(New Uri("/Images/nature19.jpg", UriKind.Relative)) myImage3.Height = 200 myImage3.Width = 200 myImages.Add(myImage3) Dim myImage4 As New Image() myImage4.Source = New BitmapImage(New Uri("/Images/nature26.jpg", UriKind.Relative)) myImage4.Height = 200 myImage4.Width = 200 myImages.Add(myImage4) Me.MyCarousel.ItemsSource = myImages

图2显示最终结果:

图2:显示图像列表的RadCarousel

RadCarousel显示图像列表

设置主题

我们套件中的控件支持不同的主题。控件中可以看到如何应用不同于默认主题的主题设置主题帮助文章。

使用隐式样式更改主题将影响在合并资源字典中定义了样式的所有控件。这仅适用于资源合并范围内的控件。

要更改主题,您可以按照以下步骤:

  • 在主题之间进行选择,并添加对相应主题程序集的引用(例如:Telerik.Windows.Themes.Material.dll).中应用的不同主题主题我们的例子WPF控件示例应用程序。

  • 将ResourceDictionaries与您从主题程序集中使用的控件所需的名称空间合并。为RadCarousel,你将需要合并以下资源:

    • Telerik.Windows.Controls
    • Telerik.Windows.Controls.Navigation

示例2演示如何合并resourcedictionary,以便将它们全局应用于整个应用程序。

例2:合并resourcedictionary

<应用程序。资源>       

控件的主题也可以使用StyleManager

图4显示了一个RadCarousel材料主题应用。

图4:材质主题的RadCarousel

材质主题的RadCarousel

另请参阅

在本文中
Baidu
map