Silverlight - Modello di contenuto

I pulsanti offrono una forma di contenuto al contenuto del modello. I modelli emergono molto nei controlli. L'idea è semplice. Accetterà qualsiasi contenuto e non solo testo. Se vuoi creare un pulsante davvero esotico, potresti persino posizionare altri controlli del contenuto come caselle di testo e pulsanti all'interno (e annidare ancora elementi all'interno di questi). È dubbio che una simile interfaccia abbia molto senso, ma è possibile.

Diamo un'occhiata a un semplice esempio con il pulsante, all'interno del pulsante altri controlli del contenuto.

<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>

Quando il codice sopra è stato compilato ed eseguito, vedrai il seguente pulsante.

RangeControl

La barra di scorrimento e i controlli del dispositivo di scorrimento sono strettamente correlati. Entrambi consentono all'utente di scegliere un valore di input da un intervallo particolare. Convenzionalmente, questi controlli significano cose diverse. Le barre di scorrimento vengono normalmente utilizzate per impostare la posizione in un'area scrotale, mentre il cursore viene utilizzato per specificare un valore o un'impostazione. Queste sono solo convenzioni; i controlli hanno comportamenti e API simili.

I controlli della gamma sono semplici da usare. Specificate i valori minimo e massimo per indicare l'intervallo di valori che vorreste che il cursore rappresentasse. IlValue la proprietà varierà al variare dell'uso dei trascinamenti.

L'eredità gerarchica di Slider la classe è la seguente:

Di seguito sono riportati quelli comunemente usati properties di Slider.

Sr. No. Proprietà e descrizione
1

Header

Ottiene o imposta il contenuto per l'intestazione del controllo.

2

HeaderProperty

Identifica la proprietà di dipendenza Header.

3

HeaderTemplate

Ottiene o imposta l'oggetto DataTemplate utilizzato per visualizzare il contenuto dell'intestazione del controllo.

4

HeaderTemplateProperty

Identifica la proprietà di dipendenza HeaderTemplate.

5

IntermediateValue

Ottiene o imposta il valore del dispositivo di scorrimento mentre l'utente interagisce con esso, prima che il valore venga agganciato al valore di graduazione o di passaggio. La proprietà SnapsTo specifica il valore del cursore.

6

IntermediateValueProperty

Identifica la proprietà di dipendenza IntermediateValue.

7

IsDirectionReversed

Ottiene o imposta un valore che indica la direzione del valore crescente.

8

IsDirectionReversedProperty

Identifica la proprietà di dipendenza IsDirectionReversed.

9

IsThumbToolTipEnabled

Ottiene o imposta un valore che determina se il valore del dispositivo di scorrimento viene visualizzato in una descrizione comandi per il componente Thumb di Slider.

10

IsThumbToolTipEnabledProperty

Identifica la proprietà di dipendenza IsThumbToolTipEnabled.

11

Orientation

Ottiene o imposta l'orientamento di un oggetto Slider.

12

OrientationProperty

Identifica la proprietà di dipendenza Orientation.

13

StepFrequency

Ottiene o imposta la parte del valore di un intervallo di valori per cui devono essere creati i passaggi.

14

StepFrequencyProperty

Identifica la proprietà di dipendenza StepFrequency.

15

ThumbToolTipValueConverter

Ottiene o imposta la logica del convertitore che converte il valore dell'intervallo del dispositivo di scorrimento in contenuto della descrizione comando.

16

ThumbToolTipValueConverterProperty

Identifica la proprietà di dipendenza ThumbToolTipValueConverter.

17

TickFrequency

Ottiene o imposta l'incremento dell'intervallo di valori per cui devono essere creati i segni di graduazione.

18

TickFrequencyProperty

Identifica la proprietà di dipendenza TickFrequency.

19

TickPlacement

Ottiene o imposta un valore che indica dove disegnare i segni di graduazione in relazione alla traccia.

20

TickPlacementProperty

Identifica la proprietà di dipendenza TickPlacement.

Di seguito sono riportati quelli comunemente usati events in Slider classe.

Sr. No. Descrizione dell'evento
1

ManipulationCompleted

Si verifica quando una manipolazione su UIElement è completa. (Ereditato da UIElement)

2

ManipulationDelta

Si verifica quando il dispositivo di input cambia posizione durante una manipolazione. (Ereditato da UIElement)

3

ManipulationInertiaStarting

Si verifica quando il dispositivo di input perde il contatto con l'oggetto UIElement durante una manipolazione e inizia l'inerzia. (Ereditato da UIElement)

4

ManipulationStarted

Si verifica quando un dispositivo di input inizia una manipolazione in UIElement. (Ereditato da UIElement)

5

ManipulationStarting

Si verifica quando il processore di manipolazione viene creato per la prima volta. (Ereditato da UIElement)

6

ValueChanged

Si verifica quando il valore dell'intervallo cambia. (Ereditato da RangeBase)

Di seguito sono riportati quelli comunemente usati methods in Classe di scorrimento.

Sr. No. Metodo e descrizione
1

OnManipulationCompleted

Chiamato prima che si verifichi l'evento ManipulationCompleted. (Ereditato da Control)

2

OnManipulationDelta

Chiamato prima che si verifichi l'evento ManipulationDelta. (Ereditato da Control)

3

OnManipulationInertiaStarting

Chiamato prima che si verifichi l'evento ManipulationInertiaStarting. (Ereditato da Control)

4

OnManipulationStarted

Chiamato prima che si verifichi l'evento ManipulationStarted. (Ereditato da Control)

5

OnManipulationStarting

Chiamato prima che si verifichi l'evento ManipulationStarting. (Ereditato da Control)

6

OnMaximumChanged

Chiamato quando la proprietà Maximum cambia. (Ereditato da RangeBase)

7

OnMinimumChanged

Chiamato quando la proprietà Minimum cambia. (Ereditato da RangeBase)

8

OnValueChanged

Genera l'evento indirizzato ValueChanged. (Ereditato da RangeBase)

9

SetBinding

Allega un'associazione a un FrameworkElement, utilizzando l'oggetto di associazione fornito. (Ereditato da FrameworkElement)

10

SetValue

Imposta il valore locale di una proprietà di dipendenza su un DependencyObject. (Ereditato da DependencyObject)

Esempio

Diamo uno sguardo a un semplice esempio in cui vengono aggiunti un cursore e un'ellisse e il cursore controlla la larghezza dell'ellisse.

<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>

Di seguito è riportato il file value changed event l'implementazione è 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; 
            } 
      } 
   } 
}

Quando il codice sopra viene compilato ed eseguito, vedrai il seguente output. Come puoi vedere, spostando il cursore da sinistra a destra, la larghezza dell'ellisse aumenta.