Discussion :

[Alkazaar]

Bonjour,

J'ai besoin de contrôler un scrollViewer via un scrollBar.
Pour cela je me suis dit qu'un petit binding entre éléments pourrait m'aider, mais je m'emmele les pinceaux entre les propriétés respectives de ces 2 contrôles.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
 
  <ScrollViewer Name="scroller1">
 
                    <StackPanel Name="myPanel"Orientation="Vertical"                      
                       ....                         
                </StackPanel>
                </ScrollViewer>
            </Border>
          <ScrollBar Name="scroller2" Orientation="Vertical"  Value="{Binding ElementName=scroller1, Mode=TwoWay}" />

voilà un extrait de mon code qui ne fonctionne pas '^_^
L'idée serait de contrôler scroller1 via scroller2
quelqu'un à une idée SVP ?

Merci d'avance.

[Samuel Blanchard]

Il te manque un Path=VerticalOffset dans ton binding, je pense.

[Alkazaar]

Merci de ta réponse.

effectivement le rajout de path=VerticalOffset dans mon binding à changé la donne, maintenant ca bouge !

Le hic, c'est que là c'est mon scroll1 qui contrôle mon scroll2 et c'est le comportement inverse qui m'interesse.

Aurais-je pris le problème à l'envers ?

Ducoup j'ai testé:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
 
 <ScrollViewer Name="scroller1" VerticalOffset="{Binding ElementName=scroller2, Path=Value, Mode=TwoWay}">
 
 <ScrollBar Name="scroller2" Orientation="Vertical" Grid.Column="1"  />

qui me renvoie une erreur à l'execution.

Une idée ?

[Invité]

Salut,

C'est normal, que t'es une erreur à l'exécution parce que dans ta liaison de données tu veux que la propriété VerticalOffset de ton ScrollViewer soit "setter" alors que le set de cette propriété est défini en internal.

[Alkazaar]

ok h2s84 merci de ta réponse.

Donc si j'ai bien compris mon binding ne fonctionne que dans un sens car le set de la propriété VerticalOffset du ScrollViewer est 'private' ?

donc je ne pourrait pas 'binder' le VerticalOffset de mon scrollBar vers celui du scrollViewer ?

[Alkazaar]

Bon je vais expliquer mon problème autrement..

pour résumer ma page est structurée ainsi:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
 
<Grid1>
<scrollbar/>
<Grid2>
<stackPanel/>
</Grid2>
</Grid1>

L'idée c'est que mon scrollBar doit faire défiler le contenu de mon stackpanel sans faire bouger ma Grid2.

Ne captant pas trop comment parametrer mon scrollBar pour qu'il 'scroll' quelque chose, j'en suis venu à l'idée tordue d'encapsuler mon stackPanel dans un scrollViewer (qui fonctionne bien tout seul), de le rendre invisible, et de 'Binder' le ScrollBar sur le ScrollViewer, apparement cela n'est pas possible.

donc bêtement j'en viens à la question : quelqu'un pourrait-il m'expliquer comment utiliser le ScrollBar ?

car j'en ai marre de m'arracher les cheveux sur la doc msdn qui en gros dit qu'un ScrollBar ca sert à 'scroller'

Ps: je suis débutant en .Net

[Invité]

Donc si j'ai bien compris mon binding ne fonctionne que dans un sens car le set de la propriété VerticalOffset du ScrollViewer est 'private' ?

exact. Sauf que c'est en internal (à peu près pareil).

donc je ne pourrait pas 'binder' le VerticalOffset de mon scrollBar vers celui du scrollViewer ?

Logiquement.

[Alkazaar]

Bon j'ai bien compris pourquoi ma bidouille ne fonctionnerais pas..

Maintenant ma question est : comment parvenir à mes fins quant à la structure de ma page ? j'ai besoin d'un scroll en bordure de ma page(Silverlight) qui ne fasse défiler qu'un seul élément(StackPanel) de la-dite page

Ne captant toujours pas comment faire fonctionner le ScrollBar, je me suis tourné vers une autre idée..

j'ai vu que le stackPanel implémente l'interface IScrollInfo afin de prendre en charge le défilement,et que IScrollInfo contient une propriété publique 'ScrollOwner' donc j'ai tenté:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
 
<Grid1>
<scrollViewer Name="scroller">
<Grid2>
<stackPanel/>
</Grid2>
</ScrollViewer>
</Grid1>

avec dans mon code behind :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
 
IScrollInfo sv = myPanel as IScrollInfo;
sv.ScrollOwner = scroller;

qui me renvoie une erreur à l'execution..

Problème toujours pas résolu..je ne vois vraiment pas comment me dépatouiller de ce foutus Scroll

[Edit]
Oups j'ai oublié de préciser que 'myPanel' est le nom de mon StackPanel.
[/Edit]

[Invité]

J'avais à peu près eu le même problème que toi il y a un an.
La discussion se trouve ici.

[Alkazaar]

Merci de ton aide, j'ai été voir le post que tu m'a indiqué, et je t'avoue que les propriétés de dépendances dépassent un peu ma compréhension actuelle..

Par contre je pense qu'il y a quelque chose à creuser du coté de l'occurence des évenements 'Loaded' car sur la dernière solution que j'ai testé l'erreur levée est une 'nullReferenceException', je vais gratter de ce coté là, peut-être plus abordable pour moi.

En espérant ne pas avoir compris de travers l'objet de la propriété 'ScrollOwner' de IScrollInfo.

[Alkazaar]

Bon quelque soit l'évenement que j'utilise j'ai systématiquement une erreur à l'execution(NullReferenceException) lorsque je fais:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
 
IScrollInfo sv = myPanel as IScrollInfo;
sv.ScrollOwner = scroller1;
sv.SetVerticalOffset(scroller1.VerticalOffset);

ca fait 2 jours que je planche sur cette satanée ScrollBar en vain.
quelque soit les forums que je parcours, dès que quelqu'un demande comment utiliser une ScrollBar la réponse est toujours "utilise plutot un ScrollViewer.." et msdn n'est pas beaucoup plus bavard à ce sujet. Et je me vois mal mettre un ScrollViewer au beau milieu de ma page.

Ma problèmatique ayant évoluée au fil de ce post je vais la reformuler de manière plus explicite :

Comment naviguer au sein d'un stackPanel à l'aide d'une ScrollBar ?

[Invité]

Comment naviguer au sein d'un stackPanel à l'aide d'une ScrollBar ?

Encore plus explicite : comment déplacer le ScrollBar d'un StackPanel à partir du code ?

[Invité]

Merci de ton aide, j'ai été voir le post que tu m'a indiqué, et je t'avoue que les propriétés de dépendances dépassent un peu ma compréhension actuelle..

Ah les propriétés de dépendances, ça fait peur quand on les définies mais d'une grande utilité.

Bon pour info, j'ai un peu appris quelques petits trucs mais utiles grâce à ton problème.
D'après MSDN, la proprieté ScrollOwner sur laquelle tu t'acharnais tant dans tes derniers posts n'est pas renseignée par défaut.Plus d'infos voir ici.
Donc du coup c'est à toi de renseigner cette proprieté en lui assignant l'instance du contrôle ScrollViewer qui englobe ton StackPanel.

Code C# :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
tonStackPanel.ScrollOwner = tonScrollViewerEnglobantTOnStackPanel;

Vu que t'es allergique aux propriétés de dépendances, je t'ai dégoté deux solutions mais la deuxième est plus propre car indépendante du panel.

La première solution utilise des propriétés de dépendance 'simples' créées dans une classe dérivant de la classe StackPanel. Donc en gros je crée un contrôle utilisateur nommé CustomStackPanel.

Code C# :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
 
public class CustomStackPanel : StackPanel
{
	public static readonly DependencyProperty CustomVerticalOffsetProperty = DependencyProperty.Register("CustomVerticalOffset", typeof(double), typeof(StackPanel), new PropertyMetadata(CustomVerticalOffsetChanged));
	public static readonly DependencyProperty CustomScrollOwnerProperty = DependencyProperty.Register("CustomScrollOwner", typeof(ScrollViewer), typeof(StackPanel), new PropertyMetadata(ScrollOwnerChanged));
 
	public double CustomVerticalOffset
	{
		get { return (double)this.GetValue(CustomVerticalOffsetProperty); }
		set { this.SetValue(CustomVerticalOffsetProperty, value); }
	}
 
	public ScrollViewer CustomScrollOwner
	{
		get { return (ScrollViewer)this.GetValue(CustomScrollOwnerProperty); }
		set { this.SetValue(CustomScrollOwnerProperty, value); }
	}
 
	public static void CustomVerticalOffsetChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e)
	{
		IScrollInfo panel = obj as IScrollInfo;
		if(panel == null) return;
		if(panel.ScrollOwner == null) throw new Exception("Vous devez définir l'objet ScrollViewer à utiliser pour cela renseigner la proprieté ScrollOwner de votre panel");
 
		double oldValue = (double)e.OldValue;
		double newValue = (double)e.NewValue;
		panel.ScrollOwner.ScrollToVerticalOffset(panel.ScrollOwner.VerticalOffset + (newValue - oldValue));
	}
 
	public static void ScrollOwnerChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e)
	{
		IScrollInfo panel = obj as IScrollInfo;
		if (panel == null) return;
		panel.ScrollOwner = e.NewValue as ScrollViewer;
	}
}

La deuxième solution utilise des propriétés de dépendance attachées. Je préfère cette solution parce qu'elle est indépendante du contrôle sur lequel on va attacher la propriété et il suffit juste que le panel qui l"utilise implémente l'interface IScrollInfo et c'est le cas avec le contrôle StackPanel.

Code c# :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
 
public class SrollInfoBehavior
{
	public static readonly DependencyProperty VerticalOffsetProperty = DependencyProperty.RegisterAttached("VerticalOffset", typeof(double), typeof(SrollInfoBehavior), new PropertyMetadata(VerticalOffsetChanged));
	public static readonly DependencyProperty ScrollOwnerProperty = DependencyProperty.RegisterAttached("ScrollOwner", typeof(ScrollViewer), typeof(SrollInfoBehavior), new PropertyMetadata(ScrollOwnerChanged));
 
	public static void SetVerticalOffset(UIElement element, object value)
	{
		element.SetValue(VerticalOffsetProperty, value);
	}
 
	public static double GetVerticalOffset(UIElement element)
	{
		return (double)element.GetValue(VerticalOffsetProperty);
	}
 
	public static void SetScrollOwner(UIElement element, ScrollViewer scrollViewer)
	{
		element.SetValue(ScrollOwnerProperty, scrollViewer);
	}
 
	public static ScrollViewer GetScrollOwner(UIElement element)
	{
		return (ScrollViewer)element.GetValue(ScrollOwnerProperty);
	}
 
	public static void VerticalOffsetChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e)
	{
		IScrollInfo panel = obj as IScrollInfo;
		if(panel == null) return;
		if(panel.ScrollOwner == null) throw new Exception("Vous devez définir l'objet ScrollViewer à utiliser pour cela renseigner la proprieté ScrollOwner de votre panel");
 
		double oldValue = (double)e.OldValue;
		double newValue = (double)e.NewValue;
		panel.ScrollOwner.ScrollToVerticalOffset(panel.ScrollOwner.VerticalOffset + (newValue - oldValue));
	}
 
	public static void ScrollOwnerChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e)
	{
		IScrollInfo panel = obj as IScrollInfo;
		if (panel == null) return;
		panel.ScrollOwner = e.NewValue as ScrollViewer;
	}
}

Pour utiliser la première solution :

Code xml :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<ScrollViewer x:Name="myScrollViewer">
	 <local:CustomStackPanel CustomScrollOwner="{Binding ElementName=myScrollViewer}" CustomVerticalOffset="{Binding Value, ElementName=myScrollBar}" >
</ScrollViewer>
<ScrollBar x:Name="myScrollBar" Width="20" Height="200" Minimum="0" Maximum="500" SmallChange="10" LargeChange="10"/>

Pour utiliser la deuxième solution :

Code xml :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<ScrollViewer x:Name="myScrollViewer">
	<StackPanel local:SrollInfoBehavior.ScrollOwner="{Binding ElementName=myScrollViewer}" local:SrollInfoBehavior.VerticalOffset="{Binding Value, ElementName=myScrollBar}" >
</ScrollViewer>
<ScrollBar x:Name="myScrollBar" Width="20" Height="200" Minimum="0" Maximum="500" SmallChange="10" LargeChange="10"/>

Dans les deux exemples local représente l'espace de nom importé dans le xaml des différentes classes. Il faut noter aussi qu'on utilise la liaison de données donc tu vas pas te casser la tête à chercher quel évènement gérer.

J'espère que cela répond à ton problème.

[Alkazaar]

Wouaw Merci infiniment, c'est pas une épine mais un tronc d'arbre que tu m'enlève du pied !

Je me met la dessus et te tiens au courant dès que c'est mis en place.

[Alkazaar]

Gasp....pour le moment je n'arrive à faire fonctionner aucune des 2 solutions

[Alkazaar]

Pour importer l'espace de nom de mes classes j'ai mis :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
 
xmlns:local="clr-namespace:MonEspaceDeNom"

mais je ne pense pas que le problème vienne de là car les classes sont reconnues dans mon XAML.

[Alkazaar]

J'ai testé les 2 classes en mode debug, et pour les 2 classes l'execution de la méthode VerticalOffsetChanged foire à tout les coups.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
 
 public static void VerticalOffsetChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e)
        {
            IScrollInfo panel = obj as IScrollInfo;
            if (panel == null) return;
            if (panel.ScrollOwner == null) throw new Exception("Vous devez définir l'objet ScrollViewer à utiliser pour cela renseigner la proprieté ScrollOwner de votre panel");
 
            double oldValue = (double)e.OldValue;
            double newValue = (double)e.NewValue;
            panel.ScrollOwner.ScrollToVerticalOffset(panel.ScrollOwner.VerticalOffset + (newValue - oldValue));
        }

l'execution quitte la méthode à

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
 
 if (panel == null) return;

Pourtant j'ai bien le stackPanel dans 'obj' ....oO

[Invité]

Oh mon Dieu on est en Silverlight .

Je savais bien que la discussion était postée dans le forum Silverlight et vu que j'ai cru qu'en testant la solution en WPF ça allait marcher et ben non !.

Pourquoi ?
Parce StackPanel n'implémente pas l'interface IScrollInfo.

Une solution qui marche avec WPF et Silverlight est d'utiliser la classe ci-dessous :

Code C# :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
 
public class ScrollViewerBehavior
{
	public static readonly DependencyProperty VerticalOffsetProperty = DependencyProperty.RegisterAttached("VerticalOffset", typeof(double), typeof(ScrollViewerBehavior), new PropertyMetadata(VerticalOffsetChanged));
 
	public static void SetVerticalOffset(UIElement element, object value)
	{
		element.SetValue(VerticalOffsetProperty, value);
	}
 
	public static double GetVerticalOffset(UIElement element)
	{
		return (double)element.GetValue(VerticalOffsetProperty);
	}
 
	public static void VerticalOffsetChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e)
	{
		ScrollViewer scrollViewer = obj as ScrollViewer;
		if (scrollViewer == null) return;
 
		double oldValue = (double)e.OldValue;
		double newValue = (double)e.NewValue;
		scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset + (newValue - oldValue));
	}
}

La propriété attachée définie dans la classe ci-dessous s'applique à un contrôle ScrollViewer comme suit :

Code xml :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<ScrollViewer x:Name="myScrollViewer"  Height="50" local:ScrollViewerBehavior.VerticalOffset="{Binding Value, ElementName=myScrollBar, Mode=OneWay}"  >
	<StackPanel x:Name="stackPanel" />
</ScrollViewer>
<ScrollBar x:Name="myScrollBar" Minimum="0" Maximum="500"  SmallChange="10" LargeChange="10" />

Fournir une deuxième solution en dérivant de la classe ScrollViewer est impossible parce que cette dernière est ne peut être héritée en Silverlight mais avec WPF c'est possible. (Bon sais pas pourquoi ).

[Alkazaar]

Hiiii Haaaa effectivement le problème venait de là. La classe ScrollViewerBehavior
marche comme sur des 'scrollettes' !!! :ccool

Je t'envoies pas de bouquet de fleur mais le coeur y est Merci encore.