2016-12-16 27 views
7

Jak wyświetlić obraz/ikonę I tekst w przycisku?UWP xaml: Jak wyświetlić przycisk z ikoną i tekstem?

<StackPanel Name="stackPanel" Orientation="Horizontal" Tapped="stackPanel_Tapped"> 
    <Button x:Name="button" FontFamily="Segoe MDL2 Assets" Content="&#xE779;" Width="50" Height="50" Background="Transparent" /> 
    <TextBlock Text="Grades" FontSize="18" VerticalAlignment="Center" /> 
</StackPanel> 

mogę dodać taplistener do StackPanel, ale to nie będzie StackPanel mieć efekt wizualny jak prawdziwy przycisk.

Próbowałem również:

<Button FontFamily="Segoe MDL2 Assets" Width="50" Height="50" x:Name="button" Content="test"> 
    <Image x:Name="button" Source="Assets/test.png" /> 
</Button> 

Ale nie mogę ustawić zawartość dwukrotnie. Chcę, aby tekst i ikona znajdowały się w przycisku, więc gdy użytkownik kliknie, będzie miał efekt wizualny podobny do przycisku. czy to możliwe? A może ktoś inny ma inną metodę, aby to osiągnąć?

Dzięki za przeczytanie.

+4

'' –

+0

@ChrisW. Dzięki, że zadziałało! Nie wiedziałem, że możesz to zrobić. – Denny

+1

@ ChhrisW. opublikuj jako odpowiedź, aby Denny mógł to zaakceptować. –

Odpowiedz

10

Ponieważ nie mogłem znaleźć bezpośredniego duplikatu (który mógłbym przysiąc, jest to rodzaj pytania, które zostało zadane wcześniej), wydaje mi się, że dostarczę uzasadnioną odpowiedź.

Sercem szablonu przycisku jest ContentPresenter, który umożliwia przekazanie dowolnego obiektu CLR. Ograniczeniem jest jednak to, że tylko jeden może być przekazany. JEDNAKŻE, jeśli ten obiekt jest panelem zdolnym pomieścić dzieci, wówczas przekaże wszystko jako treść.

Więc w tym przypadku, gdybyśmy zrobili to w ten sposób:

<Button> 
    <Image/> 
    <TextBlock/> 
</Button> 

Wtedy zakończy się niepowodzeniem i narzekać tylko jeden obiekt pozwoliło na raz.

wyjątkiem gdy podasz panel nadrzędny trzymać te dzieci, to nie narusza to wszystko za treści i zapewni pożądany wynik jako przykład:

<Button> 
    <StackPanel> 
     <Image/> 
     <TextBlock/> 
    </StackPanel> 
</Button> 

Więc skoro StackPanel jest obiektem CLR, które mogą obsługiwać dzieci, jesteś dobry, by iść. Mam nadzieję, że to pomaga, okrzyki!

+0

Również nie mogłem znaleźć bezpośredniej odpowiedzi :( – Denny

+0

Działa to zgodnie z oczekiwaniami, dzięki! – yehanny

+1

świetna odpowiedź, sprawia, że ​​przycisk jest w pełni elastyczny. – peterincumbria

Powiązane problemy