0

我正在尝试设计一个 windows phone 8 应用程序,我需要一个包含信息的列表框。我正在使用数据模板来显示我的数据。数据模板如下所示:

<DataTemplate x:Key="NewPortfolioHoldingTemplate">
        <Grid Width="Auto">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="25*"/>
                <ColumnDefinition Width="35*"/>
                <ColumnDefinition Width="30*"/>
                <ColumnDefinition Width="5*"/>
                <ColumnDefinition Width="5*"/>
            </Grid.ColumnDefinitions>
            <toolkit:PhoneTextBox x:Name="Ticker" Grid.Column="0" HorizontalAlignment="Left" Height="80" TextWrapping="Wrap" VerticalAlignment="Top" Width="Auto" Text="{Binding Ticker}" Hint="Ticker" FontSize="32" />
            <toolkit:PhoneTextBox x:Name="Shares" Grid.Column="1" HorizontalAlignment="Left" Height="80" TextWrapping="Wrap" Text="{Binding Share}" VerticalAlignment="Top" Width="Auto" Hint="Shares" />
            <toolkit:PhoneTextBox x:Name="Price"  Grid.Column="2" HorizontalAlignment="Left" Height="80" TextWrapping="Wrap" VerticalAlignment="Top" Width="Auto" Hint="Price"/>
            <Button x:Name="Add" Content="+" HorizontalAlignment="Left" VerticalAlignment="Top" Grid.Column="3" FontSize="32" />
            <Button x:Name="Remove" Content="-" HorizontalAlignment="Left" VerticalAlignment="Top" Grid.Column="4" FontSize="32" />
        </Grid>
    </DataTemplate>

我正在像这样使用这个数据模板:

 <!--ContentPanel - place additional content here-->
    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="0,0,0,0">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
        <TextBlock x:Name="NewPortNameBlock" Grid.Row="0" HorizontalAlignment="Left" TextWrapping="Wrap" Text="Name" VerticalAlignment="Top" Margin="19,19,0,0" FontSize="24"/>
        <TextBox x:Name="NewPortNameBox" Grid.Row="0" HorizontalAlignment="Left" TextWrapping="Wrap" Text="PortName" VerticalAlignment="Top" Margin="87,0,0,0" FontSize="24" Width="369"/>
        <TextBlock x:Name="NewPortCashBlock" Grid.Row="1" HorizontalAlignment="Left" TextWrapping="Wrap" Text="Cash" VerticalAlignment="Top" Margin="19,19,0,0" FontSize="24"/>
        <TextBox x:Name="NewPortCashBox" Grid.Row="1" HorizontalAlignment="Left" TextWrapping="Wrap" Text="CashAmt" VerticalAlignment="Top" Margin="87,0,0,0" FontSize="24" Width="369"/>
        <TextBlock x:Name="NewPortHoldingBlock" Grid.Row="2" HorizontalAlignment="Left" TextWrapping="Wrap" Text="Holding" VerticalAlignment="Top" Margin="19,10,0,0" FontSize="24"/>
        <ListBox x:Name="NewPortHoldingList" Grid.Row="2" Margin="10,47,10,10" ItemsSource="{Binding Holdings}" ItemTemplate="{StaticResource NewPortfolioHoldingTemplate}">

        </ListBox>
    </Grid>

注意 ListBox 的模板。当我在模拟器(WVGA 512MB)中运行它时,由于某种原因,我看不到任何按钮。我做错了什么?当我在 Blend 中编辑模板时,它看起来很好。

4

1 回答 1

0

这是 Button 控件样式的副作用。Button 的 ControlTemplate 中有一个带有边框控件的 Grid。Border 的 Margin 设置为“PhoneTouchTargetOverhang”资源的值。这样做是为了确保有足够的空间来触摸按钮(用手指触摸比用鼠标指针触摸更难)。要删除此边距,请执行以下操作

  1. 右键单击您的列表框(在设计视图中)并选择编辑附加模板 -> 编辑项目模板 -> 编辑当前。现在您将编辑您的 DataTemplate。
  2. 现在右键单击按钮,然后选择 Edit Template -> Edit a copy... 这将为按钮创建一个样式资源。
  3. 在样式中,从 Border 控件(它应该位于 VisualStateManager 元素下)中删除 Margin 属性(具有上述值)。

您的 Button 样式的边框应如下所示

<Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" 
        Background="{TemplateBinding Background}" CornerRadius="0" >
    <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" 
                    Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" 
                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" 
                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
于 2013-09-20T21:28:34.043 回答