动态删除边距和填充WPF

时间:2014-03-14 19:08:45

标签: c# wpf xaml user-interface layout

我目前正在WPF中使用表单中的页面。有两个文本框和一个列表框,其中包含一个按钮,用于在列表框中添加一些元素。在一种模式(编辑模式)中,我希望所有内容都可见,以便用户能够编辑文本框并在列表框中添加元素。在另一种模式(查看模式)中,我绑定了Visibility属性,以便在此模式下,除列表框之外的所有内容都会出现(并且列表框占据整个位置),以便用户可以只查看列表框中的现有元素。

现在我的问题是,在编辑模式下我给出了Margin =“10”边距,但在视图模式下我希望列表框采用整页宽度/高度(所以我想删除该边距)。我该怎么做?

我的XAML(某些用户控件封装在我正在使用的框架中,但它不应该影响我的问题):

<Grid x:Name="MainScope" pres:OneTheme.Theme="Content">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="53*" />
    </Grid.RowDefinitions>
    <pres:OneContentLayout Mode="List" Grid.Row="3"  Margin="10" >
    <pres:OneListBox x:Name="ListBox" BorderBrush="{DynamicResource Presentation_ControlBorderBrush}" BorderThickness="1"
                     ItemsSource="{Binding InterfaceSpecification.IOPoints}"
                     DeleteItemRequestCommand="{Binding DeleteIOPointCommand}" IsEdited="{Binding IsEditable}" >
            <pres:OneListBox.ItemTemplate>
                <DataTemplate>
                            <Grid Margin="5">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="1*" />
                                <ColumnDefinition Width="1*" />
                                <ColumnDefinition Width="Auto"/>
                        </Grid.ColumnDefinitions>

                            <vw:IOPointDefinitionView Grid.Column="0" />
                            <vw:IOPointOtherConnectedElementView Grid.Column="1" Margin="20,0"/>

                            <pres:OneIcon Grid.Column="2" IconBrush="{DynamicResource Icon_DraggableHandleHorizontal}" Margin="8,0" HorizontalAlignment="Right" Visibility="{Binding ElementName=ListBox, Path=IsEdited, Converter={StaticResource OneBooleanToVisibilityConverter}}" />

                            </Grid>
                    </DataTemplate>
            </pres:OneListBox.ItemTemplate>
    </pres:OneListBox>
    </pres:OneContentLayout>
    <pres:OneTextBox Watermark="Name..." Text="{Binding InterfaceSpecification.Name}" Margin="85,12,0,0"
                     AcceptsReturn="False" MaxLines="1" Height="22" VerticalAlignment="Top"
                     HorizontalAlignment="Left" Width="300" Visibility="{Binding IsEditable, Converter={StaticResource OneBooleanToVisibilityConverter}}" />
    <pres:OneTextBox Margin="85,3.999,10,3" Text="{Binding InterfaceSpecification.Description}"
                     Watermark="Description..." Height="66" Grid.Row="1" Visibility="{Binding IsEditable, Converter={StaticResource OneBooleanToVisibilityConverter}}"/>

    <pres:OneToggleButton x:Name="Add_Button" Content="Add IO Point" HorizontalAlignment="Right"
                          VerticalAlignment="Bottom" Margin="0,0,10,0" Grid.Row="2" Width="115" Height="18"
                          IsChecked="{Binding ElementName=Add_Popover, Path=IsOpen}"
                          pres:OneTheme.PresentationMode="Inline" Visibility="{Binding IsEditable, Converter={StaticResource OneBooleanToVisibilityConverter}}" />
...

1 个答案:

答案 0 :(得分:3)

因此,当pres:OneContentLayout为假时,你基本上希望IsEditable有0的余量,而当它是真的时,你基本希望为10,对吗?

您可以使用Trigger中的Style来完成这样的工作:

<pres:OneContentLayout.Style>
    <Style TargetType="{x:Type pres:OneContentLayout}">

        <!-- Default margin is 0 -->
        <Setter Property="Margin" Value="0" />

        <Style.Triggers>
            <!-- When in edit-mode make margin 10 -->
            <DataTrigger Binding="{Binding IsEditable}" Value="True">
                <Setter Property="Margin" Value="10" />
            </DataTrigger>
        </Style.Triggers>
    </Style>
</pres:OneContentLayout.Style>