Silverlight - Modèle de contenu

Les boutons offrent une forme de contenu au contenu du modèle. Les modèles apparaissent souvent dans les contrôles. L'idée est simple. Il acceptera n'importe quel contenu et pas seulement du texte. Si vous souhaitez créer un bouton vraiment exotique, vous pouvez même placer d'autres contrôles de contenu tels que des zones de texte et des boutons à l'intérieur (et y imbriquer des éléments fixes). Il est peu probable qu'une telle interface ait beaucoup de sens, mais c'est possible.

Jetons un coup d'œil à un exemple simple avec bouton, bouton à l'intérieur d'autres contrôles de contenu.

<UserControl x:Class = "ContentModel.MainPage" 
   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" 
   mc:Ignorable = "d" 
   d:DesignHeight = "300" d:DesignWidth = "400">
   
   <Grid x:Name = "LayoutRoot" Background = "White"> 
	
      <Button Margin = "3" Height = "70" Width = "215"> 
         <Grid Margin = "5"> 
            <Polygon Points = "100,25 125,0 200,25 125,50" Fill = "LightSteelBlue" /> 
            <Polygon Points = "100,25 75,0 0,25 75,50" Fill = "LightGray"/> 
         </Grid> 
      </Button> 
		
   </Grid> 
	
</UserControl>

Lorsque le code ci-dessus est compilé et exécuté, vous verrez le bouton suivant.

RangeControl

Les commandes de la barre de défilement et du curseur sont étroitement liées. Ils permettent tous deux à l'utilisateur de choisir une valeur d'entrée dans une plage particulière. Classiquement, ces contrôles signifient des choses différentes. Les barres de défilement sont normalement utilisées pour définir la position dans une zone scrotale, tandis que le curseur est utilisé pour spécifier une valeur ou un paramètre. Ce ne sont que des conventions; les contrôles ont des comportements et des API similaires.

Les commandes de plage sont simples à utiliser. Vous spécifiez les valeurs minimale et maximale pour indiquer la plage de valeurs que vous souhaitez que le curseur représente. leValue la propriété variera à mesure que l'utilisation des dragues varie.

L'héritage hiérarchique de Slider la classe est la suivante -

Ci-dessous sont les properties de Slider.

Vous trouverez ci-dessous les propriétés les plus couramment utilisées de Slider.

Sr. No.	Propriété et description
1	Header Obtient ou définit le contenu de l'en-tête du contrôle.
2	HeaderProperty Identifie la propriété de dépendance d'en-tête.
3	HeaderTemplate Obtient ou définit le DataTemplate utilisé pour afficher le contenu de l'en-tête du contrôle.
4	HeaderTemplateProperty Identifie la propriété de dépendance HeaderTemplate.
5	IntermediateValue Obtient ou définit la valeur du Slider pendant que l'utilisateur interagit avec lui, avant que la valeur ne soit alignée sur la valeur de graduation ou de pas. La propriété SnapsTo spécifie la valeur du curseur.
6	IntermediateValueProperty Identifie la propriété de dépendance IntermediateValue.
sept	IsDirectionReversed Obtient ou définit une valeur qui indique la direction de la valeur croissante.
8	IsDirectionReversedProperty Identifie la propriété de dépendance IsDirectionReversed.
9	IsThumbToolTipEnabled Obtient ou définit une valeur qui détermine si la valeur du curseur est affichée dans une info-bulle pour le composant Thumb du Slider.
dix	IsThumbToolTipEnabledProperty Identifie la propriété de dépendance IsThumbToolTipEnabled.
11	Orientation Obtient ou définit l'orientation d'un Slider.
12	OrientationProperty Identifie la propriété de dépendance Orientation.
13	StepFrequency Obtient ou définit la partie valeur d'une plage de valeurs pour laquelle les étapes doivent être créées.
14	StepFrequencyProperty Identifie la propriété de dépendance StepFrequency.
15	ThumbToolTipValueConverter Obtient ou définit la logique du convertisseur qui convertit la valeur de plage du curseur en contenu d'info-bulle.
16	ThumbToolTipValueConverterProperty Identifie la propriété de dépendance ThumbToolTipValueConverter.
17	TickFrequency Obtient ou définit l'incrément de la plage de valeurs pour laquelle les graduations doivent être créées.
18	TickFrequencyProperty Identifie la propriété de dépendance TickFrequency.
19	TickPlacement Obtient ou définit une valeur qui indique où dessiner les graduations par rapport à la piste.
20	TickPlacementProperty Identifie la propriété de dépendance TickPlacement.

Ci-dessous sont les events dans Slider classe.

Vous trouverez ci-dessous les événements les plus couramment utilisés de Slider.

Sr. No.	Description de l'évenement
1	ManipulationCompleted Se produit lorsqu'une manipulation sur le UIElement est terminée. (Hérité de UIElement)
2	ManipulationDelta Se produit lorsque le périphérique d'entrée change de position pendant une manipulation. (Hérité de UIElement)
3	ManipulationInertiaStarting Se produit lorsque le périphérique d'entrée perd le contact avec l'objet UIElement pendant une manipulation et l'inertie commence. (Hérité de UIElement)
4	ManipulationStarted Se produit lorsqu'un périphérique d'entrée commence une manipulation sur le UIElement. (Hérité de UIElement)
5	ManipulationStarting Se produit lorsque le processeur de manipulation est créé pour la première fois. (Hérité de UIElement)
6	ValueChanged Se produit lorsque la valeur de la plage change. (Hérité de RangeBase)

Ci-dessous sont les methods in Classe de curseur.

Vous trouverez ci-dessous les méthodes de Slider les plus couramment utilisées.

Sr. No.	Méthode et description
1	OnManipulationCompleted Appelé avant que l'événement ManipulationCompleted ne se produise. (Hérité de Control)
2	OnManipulationDelta Appelé avant que l'événement ManipulationDelta ne se produise. (Hérité de Control)
3	OnManipulationInertiaStarting Appelé avant que l'événement ManipulationInertiaStarting ne se produise. (Hérité de Control)
4	OnManipulationStarted Appelé avant que l'événement ManipulationStarted ne se produise. (Hérité de Control)
5	OnManipulationStarting Appelé avant que l'événement ManipulationStarting ne se produise. (Hérité de Control)
6	OnMaximumChanged Appelé lorsque la propriété Maximum change. (Hérité de RangeBase)
sept	OnMinimumChanged Appelé lorsque la propriété Minimum change. (Hérité de RangeBase)
8	OnValueChanged Déclenche l'événement routé ValueChanged. (Hérité de RangeBase)
9	SetBinding Attache une liaison à un FrameworkElement, à l'aide de l'objet de liaison fourni. (Hérité de FrameworkElement)
dix	SetValue Définit la valeur locale d'une propriété de dépendance sur un DependencyObject. (Hérité de DependencyObject)

Exemple

Jetons un coup d'œil à un exemple simple dans lequel un curseur et une ellipse sont ajoutés et le curseur contrôle la largeur de l'ellipse.

<UserControl x:Class = "SliderExample.MainPage" 
   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"  
   mc:Ignorable = "d" d:DesignWidth = "640" d:DesignHeight = "480"> 
   
   <Grid x:Name = "LayoutRoot">
	
      <Grid.RowDefinitions> 
         <RowDefinition Height = "Auto" /> 
         <RowDefinition /> 
      </Grid.RowDefinitions>  
		
      <Slider Minimum = "1" Maximum = "400" Value = "1" 
         ValueChanged = "Slider_ValueChanged" />  
			
      <Ellipse Grid.Row = "1" Fill = "Aqua" Width = "1" x:Name = "myEllipse" /> 
		
   </Grid> 
	
</UserControl>

Ci-dessous est le value changed event l'implémentation est C #.

using System.Windows; 
using System.Windows.Controls; 
 
namespace SliderExample { 

   public partial class MainPage : UserControl { 
	
      public MainPage() { 
         InitializeComponent(); 
      }
	  
      private void Slider_ValueChanged(object sender, 
         RoutedPropertyChangedEventArgs<double> e) { 
			
            if (myEllipse != null) { 
               myEllipse.Width = e.NewValue; 
            } 
      } 
   } 
}

Lorsque le code ci-dessus est compilé et exécuté, vous verrez la sortie suivante. Comme vous pouvez le voir, lorsque vous déplacez le curseur de gauche à droite, la largeur de l'ellipse augmente.