UWP 이미지 오버 플로우 버튼

Stackpanel 및 그리드 내부에있는 Button 내부에서 이미지를 늘리려고하지만 작동하지 않습니다. 모바일 크기에서 잘 작동하지만 응용 프로그램이 더 이상 작동하지 않는 데스크톱의 경우 이미지 오버플로가 발생합니다.UWP 이미지 오버 플로우 버튼

그리고 무엇이 바탕 화면에 보이는

내 코드 : 무엇이 잘못되었는지 말해 줄 수 그리고 난 내 이미지를 늘릴 수있는 방법을

<StackPanel x:Name="g5" Grid.Column="1" Grid.Row="1" Padding="20" Orientation="Vertical" > 
     <TextBlock Text="Site" FontSize="20"/> 
     <Button x:Name="websiteButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="0" Background="#fc0"> 
      <Image x:Name="websiteImage" Source="Assets/website.png" NineGrid="0" Margin="20,20,20,20"/> 
     </Button> 
    </StackPanel>

사람 버튼? Btw .png 파일입니다.

감사합니다. 모두들 !!

출처

2016-08-01 Thomas Montagnoni

시도 :하지만 다른 장치 플랫폼을 대상으로 레이아웃, 내 제안은이 같은 예를 들어 다른 응용 프로그램 창의 크기에 대한 Width 및 Height 속성을 설정 VisualStateManager를 사용할 수 있다는 것입니다 UniformToFill –

여전히 동일합니다 ... –

stackpanel 대신 추가 행을 사용하는 것에 대해 생각해 보셨습니까? Stackpanel의 높이가 고정되어 있지 않으므로 문제가 될 수 있습니다. – Romasz

세로 방향의 스택 패널은 높이 측면에서 어린이에게 제한을 두지 않습니다. 그것은 단지 그것들이 서로의 위에 겹쳐 지도록 보장합니다. 즉, 바탕 화면에서 버튼이 큰 폭을 가지므로 이미지가 세로로 커집니다. 이것을 방지하는 한 가지 방법은 단추 또는 이미지 내부에 MaxHeight을 설정하는 것입니다.

더 나은 솔루션은 그리드를 사용하는 것입니다 :

<Grid x:Name="g5" Height="200" HorizontalAlignment="Stretch" Padding="20"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto" /> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 
     <TextBlock Text="Site" FontSize="20"/> 
     <Button Grid.Row="1" x:Name="websiteButton" HorizontalAlignment="Stretch" Margin="0" Background="#fc0"> 
      <Image x:Name="websiteImage" Source="/Assets/Square150x150Logo.png" NineGrid="0" Margin="20,20,20,20"/> 
     </Button> 
    </Grid>

그리드의 두 번째 행이 가능한 공간을 채우기 위해 성장하는 것을 의미한다 "*"높이를 가지고있다. 이렇게하면 단추의 높이가 제한됩니다. 이미지의 기본값 Stretch은 Uniform입니다. 그러면 이미지가 버튼 내부에서 잘 보이게됩니다.

출처

2016-08-02 06:47:49

@Romasz 및 @MZetko가 옳습니다. = 당신의`Image` 스트레치에 대한 설정에

이

<VisualStateManager.VisualStateGroups> 
    <VisualStateGroup> 
     <VisualState> 
      <VisualState.StateTriggers> 
       <AdaptiveTrigger MinWindowWidth="720" /> 
       <!--for desktop--> 
      </VisualState.StateTriggers> 
      <VisualState.Setters> 
       <Setter Target="websiteButton.Width" Value="300" /> 
       <Setter Target="websiteButton.Height" Value="300" /> 
      </VisualState.Setters> 
     </VisualState> 
     <VisualState> 
      <VisualState.StateTriggers> 
       <AdaptiveTrigger MinWindowWidth="0" /> 
       <!--for mobile--> 
      </VisualState.StateTriggers> 
      <VisualState.Setters> 
       <Setter Target="websiteButton.Width" Value="150" /> 
       <Setter Target="websiteButton.Height" Value="150" /> 
      </VisualState.Setters> 
     </VisualState> 
    </VisualStateGroup> 
</VisualStateManager.VisualStateGroups>

출처

2016-08-02 07:15:18

UWP 이미지 오버 플로우 버튼

답변

관련 문제