1. 首页
  2. 问答
  3. WPF按钮在55英寸屏幕上消失

WPF按钮在55英寸屏幕上消失

2017-05-30 68 views
1

我在Visual Studio 2017中用C＃开发了一个wpf应用程序。 在目标设备（55英寸NEC触摸屏，分辨率为1920x1080）上部署软件时，我设计的按钮将在应用程序启动，而MainWindow的其余部分保持原位。我设置在<Window>标记Height="1080" Width="1920"。当我的桌面（22" ）上测试我的1920×1080的屏幕上的软件按钮已经到位WPF按钮在55英寸屏幕上消失

<Button Style="{StaticResource FlatButtonStyle}" Click="QuickGuide_Click" Name="QuickGuide" Background="#253135" Margin="375,531,1362,375"> 
     <TextBlock Text="Quick Guide" TextAlignment="Center" Foreground="AntiqueWhite" VerticalAlignment="Center" FontFamily="xyz" FontSize="12" Margin="0,59,0,58"/> 
    </Button>

我有四个按钮，所有只是不同的位置

这是整个XAML：。

<Window x:Class="Startup.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Prometheus" Height="1080" Width="1920" 
    WindowState="Maximized" 
WindowStyle="None" ResizeMode="NoResize" 
WindowStartupLocation="CenterScreen" 

    > 
<Window.Background> 
    <ImageBrush ImageSource="Resource/background_img.png"></ImageBrush> 

</Window.Background> 


<Grid Margin="12"> 





    <Grid Margin="10,4,-10,361" HorizontalAlignment="Stretch"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*"/> 
      <ColumnDefinition Width="120"/> 
     </Grid.ColumnDefinitions> 

     <Button Grid.Column="1" Content="Start" HorizontalAlignment="Right" Margin="0,10,0,0" VerticalAlignment="Top" Width="101" RenderTransformOrigin="-0.013,0.15" Name="GetEventsBtn" Click="GetEvents" Height="34" IsDefault="True" TabIndex="2" Visibility="Hidden" /> 
     <TextBlock HorizontalAlignment="Left" Margin="76,68,0,0" TextWrapping="Wrap" Text="Hi" VerticalAlignment="Top" FontFamily="" Height="60" Width="613" Foreground="#FFE0D2D2" FontSize="48"/> 
     <TextBlock HorizontalAlignment="Left" Margin="76,133,0,0" TextWrapping="Wrap" Text="Please choose one option below to get started quickly." VerticalAlignment="Top" FontFamily="" Height="46" Width="499" Foreground="#FFE0D2D2" FontSize="20"/> 

    </Grid> 




    <Button Style="{StaticResource FlatButtonStyle}" Click="QuickGuide_Click" Name="QuickGuide" Background="#253135" Margin="375,531,1362,375"> 
     <TextBlock Text="Quick Guide" TextAlignment="Center" Foreground="AntiqueWhite" VerticalAlignment="Center" FontFamily="" FontSize="12" Margin="0,59,0,58"/> 
    </Button> 


    <Button Style="{StaticResource FlatButtonStyle}" Click="PlanAMeeting_Click" Name="PlanAMeeting" Margin="170,531,1576,375"> 
     <TextBlock Grid.Row="1" Text="Plan a meeting" TextAlignment="Center" Foreground="AntiqueWhite" VerticalAlignment="Center" FontFamily="" FontSize="12"></TextBlock> 
    </Button> 

    <Button Style="{StaticResource FlatButtonStyle}" Click="CreateAMeeting_Click" Name="CreateAMeeting" Margin="375,319,1362,587"> 
     <TextBlock Grid.Row="1" TextAlignment="Center" Foreground="AntiqueWhite" VerticalAlignment="Center" FontFamily="" FontSize="12"> Create a new <LineBreak></LineBreak> meeting for now</TextBlock> 
    </Button> 

    <Button Style="{StaticResource FlatButtonStyle}" Click="StartAMeeting_Click" Name="StartAMeeting" Margin="170,319,1576,587"> 
     <TextBlock Grid.Row="1" TextWrapping="Wrap" TextAlignment="Center" Foreground="AntiqueWhite" VerticalAlignment="Center" FontFamily="" FontSize="12">Start a scheduled<LineBreak></LineBreak> meeting</TextBlock> 
    </Button> 

    <Grid MaxHeight="200" MaxWidth="600" Margin="1147,-306,39,306" > 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*"></ColumnDefinition> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions > 
      <RowDefinition Height="60" /> 
      <RowDefinition Height="20" /> 
      <RowDefinition Height="20" /> 
      <RowDefinition Height="20" /> 
      <RowDefinition Height="20" /> 
      <RowDefinition Height="20" /> 
     </Grid.RowDefinitions> 
     <TextBlock Name="GR1Z1" Foreground="White" FontSize="16" FontWeight="Bold" Grid.Row="1" Text="Please wait while loading..."></TextBlock> 
     <TextBlock Name="GR1Z2" Foreground="White" Grid.Row="2"></TextBlock> 
     <TextBlock Name="GR1Z3" Foreground="White" Grid.Row="3"></TextBlock> 
     <TextBlock Name="GR1Z4" Foreground="White" Grid.Row="4"></TextBlock> 
     <TextBlock Name="GR1Z5" Foreground="White" Grid.Row="5"></TextBlock> 
    </Grid> 

    <Grid MaxHeight="200" MaxWidth="600" Margin="1147,96,39,306"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*"></ColumnDefinition> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="60" /> 
      <RowDefinition Height="20" /> 
      <RowDefinition Height="20" /> 
      <RowDefinition Height="20" /> 
      <RowDefinition Height="20" /> 
      <RowDefinition Height="20" /> 
     </Grid.RowDefinitions> 
     <TextBlock Name="GR2Z1" Grid.Row="1" Foreground="White" FontSize="16" FontWeight="Bold"></TextBlock> 
     <TextBlock Name="GR2Z2" Grid.Row="2" Foreground="White"></TextBlock> 
     <TextBlock Name="GR2Z3" Grid.Row="3" Foreground="White"></TextBlock> 
     <TextBlock Name="GR2Z4" Grid.Row="4" Foreground="White"></TextBlock> 
     <TextBlock Name="GR2Z5" Grid.Row="5" Foreground="White"></TextBlock> 
    </Grid> 


</Grid>

和风格

<Style TargetType="Button" x:Key="FlatButtonStyle"> 
     <Setter Property="Background" Value="#253135"/> 
     <Setter Property="Foreground" Value="#253135"/> 
      <Setter Property="Width" Value="150"/> 
      <Setter Property="Height" Value="150"/> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="Button"> 
         <Border BorderThickness="0" 
        Background="{TemplateBinding Background}" 
        CornerRadius="12" 
           Name="Border"> 
          <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/> 
         </Border> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsPressed" Value="true"> 
          <Setter TargetName="Border" Property="Background" Value="White" /> 
          <Setter TargetName="Border" Property="BorderBrush" Value="Black" /> 
         </Trigger> 
        </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style>

来源

2017-05-30 J. Krue

+0

是目标屏幕和开发者屏幕可能有不同的DPI设置？ – Heinzi

+1

小建议不要使用保证金并检查您的55屏幕是否在显示设置中为100％缩放 – tabby

+4

您不应该使用绝对位置（保证金=“＃，＃，＃，＃”），但相对位置如果您想要实现动态布局。特别是你应该将按钮包含在网格中并像这样定义布局。如果您发布整个XAML，我们可以对其进行一些重构。 –

回答

1

这仅仅是给你的想法：

  • 我删除了所有Margin性质，为了不使用绝对位置，但相对位置，如果你想达到一个动态的布局。
  • 我把你的布局的左边部分放到一个三行的网格中，其中前两个是你的标题文本，最后一个是按钮。
  • 在最后一排，我把两行两列另一个网格，每个单元包含一个按钮

标记的这部分对应于下一格的后：<Grid Margin="12">：

<Grid HorizontalAlignment="Left"> 

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

     <TextBlock 
      Grid.Row="0" 
      HorizontalAlignment="Left" 
      VerticalAlignment="Top" 
      FontSize="48" 
      Foreground="#FFE0D2D2" 
      Text="Hi" 
      TextWrapping="Wrap" /> 
     <TextBlock 
      Grid.Row="1" 
      HorizontalAlignment="Left" 
      VerticalAlignment="Top" 
      FontSize="20" 
      Foreground="#FFE0D2D2" 
      Text="Please choose one option below to get started quickly." 
      TextWrapping="Wrap" /> 

     <Grid Grid.Row="2"> 

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

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

      <Button 
       Name="QuickGuide" 
       Grid.Row="0" 
       Grid.Column="0" 
       Background="#253135" 
       Style="{StaticResource FlatButtonStyle}"> 
       <TextBlock 
        VerticalAlignment="Center" 
        FontSize="12" 
        Foreground="AntiqueWhite" 
        Text="Quick Guide" 
        TextAlignment="Center" /> 
      </Button> 

      <Button 
       Name="PlanAMeeting" 
       Grid.Row="1" 
       Grid.Column="1" 
       Style="{StaticResource FlatButtonStyle}"> 
       <TextBlock 
        VerticalAlignment="Center" 
        FontSize="12" 
        Foreground="AntiqueWhite" 
        Text="Plan a meeting" 
        TextAlignment="Center" /> 
      </Button> 

      <Button 
       Name="StartAMeeting" 
       Grid.Row="1" 
       Grid.Column="0" 
       Style="{StaticResource FlatButtonStyle}"> 
       <TextBlock 
        VerticalAlignment="Center" 
        FontSize="12" 
        Foreground="AntiqueWhite" 
        TextAlignment="Center" 
        TextWrapping="Wrap"> 
        Start a scheduled 
        <LineBreak /> 
        meeting 
       </TextBlock> 
      </Button> 

      <Button 
       Name="CreateAMeeting" 
       Grid.Row="0" 
       Grid.Column="1" 
       Style="{StaticResource FlatButtonStyle}"> 
       <TextBlock 
        VerticalAlignment="Center" 
        FontSize="12" 
        Foreground="AntiqueWhite" 
        TextAlignment="Center"> 
        Create a new 
        <LineBreak /> 
        meeting for now 
       </TextBlock> 
      </Button> 


     </Grid> 

    </Grid>

来源

2017-05-30 08:15:37

+1

这对开始使用相对位置很有帮助！非常感谢你。 –

相关问题

 相关问题