Fisarmonica Articolo non in stato visivo corretto

Question

Devo usare una fisarmonica per visualizzare alcuni totali su un'applicazione LOB che stiamo costruendo.

Se inserisco la fisarmonica in XAML tutto funziona bene e lo stato dell'icona (>) è corretto e punta a destra. Quando il mouse entra nell'Armion Fisarmonica non cambia visivamente lo stato.

Se aggiungo dinamicamente AccordionItems su un pulsante Fai clic (per simulare il ritorno di una chiamata di dati asincroni) lo stato dell'icona non è lo stesso e su MouseImmettilo " correggi " stesso eseguendo un cambiamento di stato visivo. * Potrebbe essere necessario fare clic su " Aggiungi 3 articoli per fisarmonica " due volte.

Se aggiungo dinamicamente una fisarmonica su un pulsante, clic con AccordionItems funziona perfettamente. Di seguito è la mia applicazione di esempio.

Quindi cosa devo fare per ottenere la fisarmonica per aggiungere AcordionItems in fase di esecuzione ed essere nello stato corretto come quando uso 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

{       conteggio int privato = 0;   pubblica MainPage ()   {    // Richiesto per inizializzare le variabili    InitializeComponent ();          //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

Chiamata TestAccordion.UpdateLayout (); dopo aver aggiunto gli elementi ... potrebbe essere

Answer 2

Se dai un'occhiata al codice sorgente per il controllo Accordian vedrai che usa InteractionHelper.UpdateVisualState per impostare il suo stato corretto dopo gli eventi.

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" });
    }
}

Poiché il metodo è contrassegnato come interno sul controllo Accordian e InteractionHelper è una variabile privata, la soluzione migliore è capire in quali stati si sta aggiungendo il controllo e quindi dire al controllo di passare a quello stato ( senza transizione) prima di aggiungerlo all'albero visivo. Questo è il motivo per cui MouseOver sta "riparando" esso.

Answer 3

Puoi legare gli elementi della fisarmonica a un ObservableCollection?