控件通过Windows Phone 8.1上的ComboBox下拉列表显示

时间:2014-07-04 15:08:46

标签: xaml visual-studio-2013 windows-phone-8.1

我刚开始使用VS2013和Windows Phone SDK 8开始使用XAML。我在网格中有一些带有一些ComboBox控件的HubSection。当您打开ComboBox下拉列表时,它会在下拉列表中显示应该在其后面的控件。

有关如何解决此问题的任何建议?即使我可以单独打开下拉菜单(我还有另外一个包含13个项目的ComboBox,如果打开它会自动显示全屏)。

感谢您的帮助。

screenshot http://i112.photobucket.com/albums/n182/capellanx/wp_ss_20140704_0002_zps877f0a6a.jpg

<HubSection x:Uid="CharacterInfo" Header="Character Information" DataContext="{Binding Groups}" HeaderTemplate="{ThemeResource HubSectionHeaderTemplate}">
            <DataTemplate>
                <Grid>
                    <TextBlock HorizontalAlignment="Left" Margin="10,0,0,0" TextWrapping="Wrap" Text="Character Name:" VerticalAlignment="Top" FontSize="18"/>
                    <TextBox HorizontalAlignment="Left" Margin="10,20,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="321" Height="10"/>

                    <TextBlock HorizontalAlignment="Left" Margin="10,60,0,0" TextWrapping="Wrap" Text="Breed:" VerticalAlignment="Top" FontSize="18"/>
                    <ComboBox HorizontalAlignment="Left" Margin="10,80,0,0" VerticalAlignment="Top" Width="321">
                        <ComboBoxItem Tag="HOMID" IsSelected="True">Homid</ComboBoxItem>
                        <ComboBoxItem Tag="METIS">Metis</ComboBoxItem>
                        <ComboBoxItem Tag="LUPUS">Lupus</ComboBoxItem>
                    </ComboBox>

                    <TextBlock HorizontalAlignment="Left" Margin="10,150,0,0" TextWrapping="Wrap" Text="Auspice:" VerticalAlignment="Top" FontSize="18"/>
                    <ComboBox HorizontalAlignment="Left" Margin="10,170,0,0" VerticalAlignment="Top" Width="321">
                        <ComboBoxItem Tag="RAGABASH" IsSelected="True">Ragabash (New Moon)</ComboBoxItem>
                        <ComboBoxItem Tag="THEURGE">Theurge (Crescent Moon)</ComboBoxItem>
                        <ComboBoxItem Tag="PHILODOX">Philodox (Half Moon)</ComboBoxItem>
                        <ComboBoxItem Tag="GALLIARD">Galliard (Gibbous Moon)</ComboBoxItem>
                        <ComboBoxItem Tag="AHROUN">Ahroun (Full Moon)</ComboBoxItem>
                    </ComboBox>

                    <TextBlock HorizontalAlignment="Left" Margin="10,240,0,0" TextWrapping="Wrap" Text="Tribe:" VerticalAlignment="Top" FontSize="18"/>
                    <ComboBox HorizontalAlignment="Left" Margin="10,260,0,0" VerticalAlignment="Top" Width="321">
                        <ComboBoxItem Tag="BLACKFURIES" IsSelected="True">Black Furies</ComboBoxItem>
                        <ComboBoxItem Tag="BONEGNAWERS">Bone Gnawers</ComboBoxItem>
                        <ComboBoxItem Tag="CHILDRENOFGAIA">Children of Gaia</ComboBoxItem>
                        <ComboBoxItem Tag="FIANNA">Fianna</ComboBoxItem>
                        <ComboBoxItem Tag="GETOFFENRIS">Get of Fenris</ComboBoxItem>
                        <ComboBoxItem Tag="GLASSWALKERS">Glass Walkers</ComboBoxItem>
                        <ComboBoxItem Tag="REDTALONS">Red Talons</ComboBoxItem>
                        <ComboBoxItem Tag="SHADOWLORDS">Shadow Lords</ComboBoxItem>
                        <ComboBoxItem Tag="SILENTSTRIDERS">Silent Striders</ComboBoxItem>
                        <ComboBoxItem Tag="SILVERFANGS">Silver Fangs</ComboBoxItem>
                        <ComboBoxItem Tag="STARGAZERS">Stargazers</ComboBoxItem>
                        <ComboBoxItem Tag="UKTENA">Uktena</ComboBoxItem>
                        <ComboBoxItem Tag="WENDIGO">Wendigo</ComboBoxItem>
                    </ComboBox>
                </Grid>
            </DataTemplate>
        </HubSection>

1 个答案:

答案 0 :(得分:3)

问题是控件位于网格内,这会导致控件相互叠加,除非您使用不同的行/列。但最简单的方法是使用StackPanel,这会导致元素自动水平或垂直堆叠。这意味着您不需要使用手动边距和对齐来获得良好的布局。

这是修改过的XAML,我还添加了一个ScrollViewer,以便让ComboBox扩展出视图:

<HubSection x:Uid="CharacterInfo" Header="Character Information" DataContext="{Binding Groups}">
    <DataTemplate>
        <ScrollViewer>
            <StackPanel>
                <TextBlock TextWrapping="Wrap" Text="Character Name:" FontSize="18"/>
                <TextBox TextWrapping="Wrap" Text="TextBox"/>

                <TextBlock TextWrapping="Wrap" Text="Breed:" FontSize="18"/>
                <ComboBox>
                    <ComboBoxItem Tag="HOMID" IsSelected="True">Homid</ComboBoxItem>
                    <ComboBoxItem Tag="METIS">Metis</ComboBoxItem>
                    <ComboBoxItem Tag="LUPUS">Lupus</ComboBoxItem>
                </ComboBox>

                <TextBlock TextWrapping="Wrap" Text="Auspice:" FontSize="18"/>
                <ComboBox>
                    <ComboBoxItem Tag="RAGABASH" IsSelected="True">Ragabash (New Moon)</ComboBoxItem>
                    <ComboBoxItem Tag="THEURGE">Theurge (Crescent Moon)</ComboBoxItem>
                    <ComboBoxItem Tag="PHILODOX">Philodox (Half Moon)</ComboBoxItem>
                    <ComboBoxItem Tag="GALLIARD">Galliard (Gibbous Moon)</ComboBoxItem>
                    <ComboBoxItem Tag="AHROUN">Ahroun (Full Moon)</ComboBoxItem>
                </ComboBox>

                <TextBlock TextWrapping="Wrap" Text="Tribe:" FontSize="18"/>
                <ComboBox>
                    <ComboBoxItem Tag="BLACKFURIES" IsSelected="True">Black Furies</ComboBoxItem>
                    <ComboBoxItem Tag="BONEGNAWERS">Bone Gnawers</ComboBoxItem>
                    <ComboBoxItem Tag="CHILDRENOFGAIA">Children of Gaia</ComboBoxItem>
                    <ComboBoxItem Tag="FIANNA">Fianna</ComboBoxItem>
                    <ComboBoxItem Tag="GETOFFENRIS">Get of Fenris</ComboBoxItem>
                    <ComboBoxItem Tag="GLASSWALKERS">Glass Walkers</ComboBoxItem>
                    <ComboBoxItem Tag="REDTALONS">Red Talons</ComboBoxItem>
                    <ComboBoxItem Tag="SHADOWLORDS">Shadow Lords</ComboBoxItem>
                    <ComboBoxItem Tag="SILENTSTRIDERS">Silent Striders</ComboBoxItem>
                    <ComboBoxItem Tag="SILVERFANGS">Silver Fangs</ComboBoxItem>
                    <ComboBoxItem Tag="STARGAZERS">Stargazers</ComboBoxItem>
                    <ComboBoxItem Tag="UKTENA">Uktena</ComboBoxItem>
                    <ComboBoxItem Tag="WENDIGO">Wendigo</ComboBoxItem>
                </ComboBox>
            </StackPanel>
        </ScrollViewer>
    </DataTemplate>
</HubSection>