组合框未在堆栈面板中正确设置宽度

Combobox not setting width right in stack panel

我正在尝试在 WPF 中设计一个表单。到目前为止:

<Window x:Class="OCLMEditor.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:OCLMEditor"
        mc:Ignorable="d"
        Title="Christian Life and Ministry Editor" Height="517.366" Width="729.7">
    <Grid Margin="0,0,0,3">
        <StackPanel Grid.Row="0" Grid.ColumnSpan="4" VerticalAlignment="Top" >
            <Menu x:Name="menuOCLM">
                <MenuItem Header="File">
                    <MenuItem Header="Download Schedule Information"/>
                    <Separator/>
                    <MenuItem Header="Export Student Information"/>
                    <MenuItem Header="Import Student Information"/>
                    <Separator/>
                    <MenuItem Header="Page Setup"/>
                    <MenuItem Header="Print Preview"/>
                    <Separator/>
                    <MenuItem Header="Update Google Calendar"/>
                    <Separator/>
                    <MenuItem Header="Exit"/>
                </MenuItem>
                <MenuItem Header="Edit"/>
                <MenuItem Header="View"/>
                <MenuItem Header="Options"/>
                <MenuItem Header="Help"/>
            </Menu>
        </StackPanel>
        <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch">
            <Grid.Row>1</Grid.Row>
            <StackPanel Margin="5 0 0 0" HorizontalAlignment="Stretch">
                <Grid.Column>0</Grid.Column>
                <Grid.Row>1</Grid.Row>
                <Grid.RowSpan>2</Grid.RowSpan>
                <Label>Week of Meeting:</Label>
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch">
                    <ComboBox>
                        <ComboBoxItem>
                            <StackPanel Orientation="Horizontal">
                                <Image Source="special_event.png"></Image>
                                <Label>Date 1</Label>
                            </StackPanel>
                        </ComboBoxItem>
                        <ComboBoxItem>
                            <StackPanel Orientation="Horizontal">
                                <Image Source="special_event.png"></Image>
                                <Label>Date 2</Label>
                            </StackPanel>
                        </ComboBoxItem>
                        <ComboBoxItem>
                            <StackPanel Orientation="Horizontal">
                                <Image Source="special_event.png"></Image>
                                <Label>Date 3</Label>
                            </StackPanel>
                        </ComboBoxItem>
                    </ComboBox>
                    <Image HorizontalAlignment="Right" Source="event_time.png"></Image>
                </StackPanel>
                <Label>Note:</Label>
                <ComboBox IsEditable="True">
                    <ComboBoxItem>Sample Text</ComboBoxItem>
                </ComboBox>
                <Label>Bible Reading for Week:</Label>
                <TextBox>PSALMS 60-68</TextBox>
                <Label>Opening Song:</Label>
                <ComboBox>
                    <ComboBoxItem>Song 1</ComboBoxItem>
                    <ComboBoxItem>Song 2</ComboBoxItem>
                    <ComboBoxItem>Song 3</ComboBoxItem>
                </ComboBox>
            </StackPanel>
            <StackPanel Orientation="Vertical" Margin="10 0 0 0">
                <Label>Chairman:</Label>
                <ComboBox></ComboBox>
                <Label>Auxiliary Counsellor 1:</Label>
                <ComboBox></ComboBox>
                <Label>Auxiliary Counsellor 2:</Label>
                <ComboBox></ComboBox>
                <Label>Prayer:</Label>
                <ComboBox></ComboBox>
            </StackPanel>

        </StackPanel>
        <GridSplitter Grid.Column="1" Background="Yellow" HorizontalAlignment="Left" Width="5"></GridSplitter>
        <WebBrowser x:Name="htmlView" VerticalAlignment="Stretch">
            <Grid.Column>1</Grid.Column>
            <Grid.Row>1</Grid.Row>
            <Grid.RowSpan>4</Grid.RowSpan>
        </WebBrowser>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="25*"/>
            <ColumnDefinition Width="50*"/>
            <ColumnDefinition Width="25*"/>
        </Grid.ColumnDefinitions>
    </Grid>

</Window>

问题:

有几个问题,但我将把这个问题限制为 1。组合不够宽。组合和图像应填满宽度。

StackPanel 旨在无限增长,它不适合您的需要。 Grid 会是不错的选择。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="auto"/>
    </Grid.ColumnDefinitions>
    <ComboBox>
        <ComboBoxItem>
            <StackPanel Orientation="Horizontal">
                <Image Source="special_event.png"></Image>
                <Label>Date 1</Label>
            </StackPanel>
        </ComboBoxItem>
        <ComboBoxItem>
            <StackPanel Orientation="Horizontal">
                <Image Source="special_event.png"></Image>
                <Label>Date 2</Label>
            </StackPanel>
        </ComboBoxItem>
        <ComboBoxItem>
            <StackPanel Orientation="Horizontal">
                <Image Source="special_event.png"></Image>
                <Label>Date 3</Label>
            </StackPanel>
        </ComboBoxItem>
    </ComboBox>
    <Image Grid.Column="1" HorizontalAlignment="Right" Source="event_time.png"></Image>                    
</Grid>