Silverlight Grid Dimensione automatica non funziona all'interno di tela

Question

Come si fa una larghezza della griglia al 100% all'interno di una tela? Ecco un po 'di XAML semplice ma non funziona come previsto.

<Canvas Background="MediumSlateBlue" Width="Auto" Height="Auto" >
    <Grid x:Name="LayoutRoot" MouseMove="MainPage_MouseMove" Background="Beige" >
        <TextBlock x:Name="lblDisplay" Height="24" HorizontalAlignment="Right" VerticalAlignment="Top" Width="128" Text="asdf" ></TextBlock>
    </Grid>
</Canvas>

Non capisco perché la mia griglia non occupa più spazio possibile! Ho anche provato ad aggiungere una singola riga e una definizione della colonna con una larghezza di 100*, ma la mia griglia occuperà solo lo spazio dell'etichetta che contiene. L'obiettivo è avere una tela, con un bambino della griglia e occupa di larghezza e altezza del 100%. Questo è importante perché ho bisogno che Silverlight si ridimensiona quando il browser si ridimensiona.

Answer 1

Sembra che io abbia trovato una soluzione qui

http://forums.silverlight.net/forums/t/13415.aspx

Ho regolato il mio codice per ridimensionare automaticamente la mia griglia ogni volta che il contenuto viene ridimensionato. Ciò mi permetterà di posizionare elementi in modo assoluto usando Canvas.LeftProperty e mantenere la posizione di elementi allineati orizzontalmente/verticalmente.

Ho pensato di usare solo una griglia come il mio layout principale, tuttavia se la necessità non fosse stata animata per animare un oggetto, il margine non può essere animato. Inoltre, l'impostazione del margine a sinistra e in alto durante l'evento MouseMove non ha posizionato accuratamente il mio elemento nella posizione del cursore.

Answer 2

Canvas stabilisce il suo contenuto usando un posizionamento assoluto. È molto più simile al modo in cui le forme di Windows hanno funzionato in quanto tutti gli elementi devono avere una parte superiore, a sinistra, larghezza e altezza specificate.

È possibile ottenere funzionalità simili sostituendo la tela con una griglia che non ha righe/colonne definite e utilizzare margini per posizionare gli elementi figlio.

Answer 3

Controlla anche per assicurarti che il tuo modulo stia effettivamente allungando l'applicazione Silverlight.

<form id="form1" runat="server" style="height:100%">
<div id="silverlightControlHost">
    <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
      <param name="source" value="clientbin/MyApp.xap"/>
      <param name="onError" value="onSilverlightError" />
      <param name="background" value="white" />
      <param name="minRuntimeVersion" value="3.0.40818.0" />
      <param name="autoUpgrade" value="true" />
      <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40818.0" style="text-decoration:none">
          <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style:none"/>
      </a>
    </object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe></div>
</form>