UserControl abgeschnitten, wenn in MainWindow verwendet

Question

Hallo Stackoverflowers!

Ich erstelle eine Liste mit einer Suchleiste in XAML, und als ich versuchte, mein neues UserControl in MainWindow.xaml zu verwenden, wird der Button im UserControl im Designer zugeschnitten und nicht angepasst, warum ist das so ? Hier

ist der MainWindow.xaml Körper:

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="2*"/> 
     <ColumnDefinition Width="8*" /> 
    </Grid.ColumnDefinitions> 

    <controls:SearchBox Grid.Column="0"/> 
</Grid> 

Und hier ist der Körper des Custom Controls:

<Grid.RowDefinitions> 
     <RowDefinition Height="*" /> 
     <RowDefinition Height="8*" /> 
    </Grid.RowDefinitions> 

    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="8*" /> 
     <ColumnDefinition Width="*" /> 
    </Grid.ColumnDefinitions> 

    <TextBox 
     Grid.Row="0" 
     VerticalAlignment="Center" 
     Text="Search" 
     TextBlock.FontStyle="Italic" 
     TextBlock.TextAlignment="Left" 
     /> 

    <!-- Content="{StaticResource FilterLogo}" --> 
    <Button 
     Grid.Column="1" 
     Content="Filter" 
     VerticalAlignment="Center" 
     HorizontalAlignment="Stretch"> 
    </Button> 


    <ListBox 
     Grid.Row="1" 
     Grid.ColumnSpan="2" 
     ItemsSource="{Binding DataContext}" 
     SelectedItem="{Binding DataContext}" 
     ScrollViewer.VerticalScrollBarVisibility="Visible"> 

    </ListBox> 

Ich weiß wirklich nicht, warum meine Kontrolle abgeschnitten ist, ehrlich zu sein . Irgendwelche Blei bitte?

Answer 1

Kurze Antwort: es passt nicht.

Sie haben zwei Spalten in Ihrem Hauptfenster. Da Sie nicht angegeben haben, in welcher Spalte das Benutzersteuerelement platziert werden soll, wird standardmäßig die erste Spalte verwendet. Aber Ihre Width Definitionen zwingen diese Spalte zu einem Viertel der Größe der zweiten Spalte.

Ihr SearchBox passt einfach nicht in den Platz, den Sie ihm zugewiesen haben.

Wenn Sie den Stern (*) von dieser Linie zu entfernen:

<ColumnDefinition Width="8*" /> 

... wird es passen, ohne abgeschnitten zu werden. (Alternativ könnten Sie das Benutzersteuerelement in der zweiten Spalte platzieren oder das Hauptfenster erweitern oder die Breite Ihres Benutzersteuerelements verkleinern.)

Answer 2

Wenn Sie Sterne in den Spalten- und Zeilendefinitionen verwenden, verwenden Sie diese wie Prozentsätze. Wie folgt aus:

<Grid.ColumnDefinitions> 
    <ColumnDefinition Width=".1*" /> <!-- 10% --> 
    <ColumnDefinition Width=".9*" /> <!-- 90% --> 
</Grid.ColumnDefinitions> 

Dies ist, was die XAML-Leser aus Ihrer Nutzung interpretiert:

<Grid.ColumnDefinitions> 
    <ColumnDefinition Width="8*" /> <!-- 800% --> 
    <ColumnDefinition Width="*" /> <!-- 100% --> 
</Grid.ColumnDefinitions> 

Dies wird unerwünschte Folgen haben.