Akkordeon Artikel nicht in der richtigen visuellen Zustand

Question

Ich brauche ein Akkordeon zu verwenden, um einige Summen auf einer LOB-Anwendung angezeigt werden wir bauen.

Wenn ich das Akkordeon in XAML legen alles funktioniert gut und den Zustand des Symbols (>) ist korrekt und zeigt auf der rechten Seite. Auf Maus die AccordionItem Eingabe tun wir nicht eine visuelle Zustandsänderung haben.

Wenn ich dynamisch AccordionItems auf einer Schaltfläche klicken, fügen Sie den Zustand des Symbols (asynchronen Datenanruf Rückkehr zu simulieren) ist nicht das Gleiche und auf MouseEnter- es „korrigiert“ selbst durch einen visuellen Zustandswechsel ausgeführt wird. * Sie können „Hinzufügen 3 Akkordeon Items“ klicken müssen zweimal.

Wenn ich dynamisch ein Akkordeon auf einem Button-Klick mit AccordionItems hinzufügen funktioniert es gut. Unten ist meine Beispielanwendung.

Also, was muß ich das Akkordeon bekommen tun AcordionItems zur Laufzeit hinzuzufügen und im richtigen Zustand zu sein, wie pro wenn XAML?

XAML

 <Grid x:Name="LayoutRoot" Background="Black" >
  <StackPanel x:Name="TheStackPanel">
     <Button Content="Create Accordion" Click="CreateAccordionItems"></Button>
     <Button Content="Add 3 Accordion Items" Click="AddAccordionItems"></Button>
     <Grid Background="Pink">
        <layoutToolkit:Accordion SelectionMode="ZeroOrMore" x:Name="TestAccordion" Margin="10,10,10,10" HorizontalAlignment="Stretch"  >
           <layoutToolkit:AccordionItem Content="Content - 1" Header="Header - 1">
           </layoutToolkit:AccordionItem>
           <layoutToolkit:AccordionItem Content="Content - 2" Header="Header - 2">
           </layoutToolkit:AccordionItem>
           <layoutToolkit:AccordionItem Content="Content - 3" Header="Header - 3">
           </layoutToolkit:AccordionItem>
        </layoutToolkit:Accordion>
     </Grid>
  </StackPanel>

 public partial class MainPage : UserControl

{       private int count = 0;   public Mainpage ()   {    // Erforderlich, um Variablen zu initialisieren    Initialisieren der Komponente();          //TestAccordion.ExpandDirection = ExpandDirection.Down;       }

  private void AddAccordionItems( object sender, RoutedEventArgs e )
  {
     AddToAccordion( 3, TestAccordion );
  }

  private void AddToAccordion( int size, Accordion _Accordion )
  {
     for( int i = 0; i < size; i++ )
     {
        AccordionItem accordionItem = new AccordionItem( );
        accordionItem.Header = "Item " + count.ToString( );
        count++;
        _Accordion.Items.Add( accordionItem );
        Grid aGrid = new Grid( );
        TextBlock tb = new TextBlock( );
        tb.Text = accordionItem.Header as string;
        aGrid.Children.Add( tb );
        accordionItem.Content = aGrid;
        //accordionItem.IsEnabled = true;
        accordionItem.IsSelected = true;
     }
  }

  private void CreateAccordionItems( object sender, RoutedEventArgs e )
  {
     Accordion accordion = new Accordion( );
     accordion.HorizontalContentAlignment = HorizontalAlignment.Stretch;
     TheStackPanel.Children.Add( accordion );
     AddToAccordion( 10, accordion );
  }

}

Answer 1

Anruf TestAccordion.UpdateLayout (); nach dem Hinzufügen von Elementen ... sein kann

Answer 2

Wenn Sie einen Blick auf den Quellcode für die Accordian die Kontrolle übernehmen Sie werden sehen, dass es die InteractionHelper.UpdateVisualState nutzt seine korrekten Zustand nach Ereignisse einzustellen.

public void UpdateVisualStateBase(bool useTransitions)
{
    if (!this.Control.IsEnabled)
    {
        VisualStates.GoToState(this.Control, useTransitions, new string[] { "Disabled", "Normal" });
    }
    else if (this.IsReadOnly)
    {
        VisualStates.GoToState(this.Control, useTransitions, new string[] { "ReadOnly", "Normal" });
    }
    else if (this.IsPressed)
    {
        VisualStates.GoToState(this.Control, useTransitions, new string[] { "Pressed", "MouseOver", "Normal" });
    }
    else if (this.IsMouseOver)
    {
        VisualStates.GoToState(this.Control, useTransitions, new string[] { "MouseOver", "Normal" });
    }
    else
    {
        VisualStates.GoToState(this.Control, useTransitions, new string[] { "Normal" });
    }
    if (this.IsFocused)
    {
        VisualStates.GoToState(this.Control, useTransitions, new string[] { "Focused", "Unfocused" });
    }
    else
    {
        VisualStates.GoToState(this.Control, useTransitions, new string[] { "Unfocused" });
    }
}

Da das Verfahren auf der Accordian Steuer interne markiert und der InteractionHelper ist eine private Variable, die beste Wahl ist, um herauszufinden, welche die Zustände Sie hinzufügen die Kontrolle in und dann der Kontrolle sagen zu diesem Zustand zu gehen ( ohne Übergang), bevor es zu der visuellen Struktur addig. Deshalb ist der Mouseover wird es „Fixierung“.

Answer 3

Können Sie das Akkordeon Artikel an eine ObservableCollection binden?