piątek, 2 października 2009

[Behaviors] Mouse Over ComboBox Open (Behavior)

Po ostatnim małym sukcesie (7 dni i ponad 700 ściągnięć) z behaviorsem (patrz poprzedni wpis), postanowiłem że gdy kolejny raz przyjdzie mi do głowy jakiś nowy prosty behavior, również się nim podzielę.

Prościej się nie da

Mój najnowszy behavior nie może być prostszy, bo poniżej jednej linii kodu która rzeczywiście coś robi, nie da się zejść ;) Na szczęście jego działanie stawia go w innym świetle. A o co chodzi? Otóż mój nowy behavior, jak nazwa tego wpisu sugeruje, otwiera listę ComboBoxa po najechaniu na nią myszką. Tada!!! :P

Live demo

Niby nic ale rzeczywiście przydaje się w wielu aplikacjach. Po co użytkownik ma klikać na listę żeby się rozwinęła, skoro może najechać na nią myszką, zawsze to o jeden click mniej! :)

Dodajemy do kodu

<ComboBox Height="29" Width="130" d:LayoutOverrides="Margin">
<interaction:Interaction.Behaviors>
<behavior:OpenComboBoxBehavior />
</interaction:Interaction.Behaviors>
<ComboBoxItem>
<TextBlock Text="First element" />
</ComboBoxItem>
<ComboBoxItem>
<TextBlock Text="Second element" />
</ComboBoxItem>
<ComboBoxItem>
<TextBlock Text="Third element" />
</ComboBoxItem>
<ComboBoxItem>
<TextBlock Text="Fourth element" />
</ComboBoxItem>
</ComboBox>

, gdzie "i:" jest przestrzenią nazw dla "clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity", a "behavior:" dla projektu w którym umieszczony jest kod bahaviora.

Wady

Ten Behavior w ogóle nie nadaje się w interfejsach gdzie mamy wiele elementów i ciągle rozwijająca się lista tylko by zasłaniała pozostałe elementy, natomiast jest świetny w paskach menu, przyciskach z dodatkowymi opcjami itp.

Inspiracja

Oczywiście sam na taki pomysł ulepszenie ergonomii interfejsu nie wpadłem, a zwyczajnie podpatrzyłem go na stronie youtube.com. :) Jeżeli przyjrzycie się swojemu użytkownikowi w prawym górnym rogu, to zobaczycie że jak najedziecie na swój profil myszką, to bez klikania rozwija się bardzo wygodna lista dodatkowych opcji.

Source Code

Tradycyjnie, ponieważ kod jest krótki, wklejam całość.

using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Interactivity;

/// Behavior for ComboBox control.
/// It invokes drop down list when mouse is over it.
///
/// Jacek Ciereszko
/// http://geekswithblogs.net/SilverBlog/
///

///

namespace ComboBoxBehavior
{
public class OpenComboBoxBehavior : Behavior
{
///
/// Called after the Behavior is attached to an AssociatedObject.
///

/// Override this to hook up functionality to the AssociatedObject.
protected override void OnAttached()
{
base.OnAttached();
this.AssociatedObject.MouseEnter += new MouseEventHandler(AssociatedObject_MouseEnter);
}

///
/// Called after the Behavior is detached from an AssociatedObject.
///

/// Override this to hook up functionality to the AssociatedObject.
protected override void OnDetaching()
{
this.AssociatedObject.MouseEnter -= new MouseEventHandler(AssociatedObject_MouseEnter);
base.OnDetaching();
}

///
/// When mouse is over ComboBox, control drop down will open
///

///
///
void AssociatedObject_MouseEnter(object sender, MouseEventArgs e)
{
this.AssociatedObject.IsDropDownOpen = true;
}
}
}

Do pobrania

Kod jest także dostępny do pobrania na stronie http://gallery.expression.microsoft.com/en-us/OpenComboBoxDropDown.


Pozdrawiam,

Jacek Ciereszko

Brak komentarzy: