국경의 배경으로 이미지를 사용하도록 데이터베인딩을 얻을 수 없습니다.

StackOverflow https://stackoverflow.com/questions/1219920

문제

국경의 배경으로 이미지를 사용하여 데이터를 사용하려고 할 때 WPF에 문제가 발생합니다. 이런 식으로 이미지를 렌더링하는 데 문제가 없습니다.

<Image Name="imgPlayer" Width="100" Height="100"
    Source="{Binding Converter={StaticResource ImageConverter}, Path=Image}"
/>

내 defaultimageconverter는 이미지가 null인지 확인하고, 그렇다면 프로젝트에 내장 된 자원 인 "이미지가 없음"Bitmapimage를 반환합니다. 이것은 또한 훌륭하게 작동합니다.

그것이 중요한지 확실하지 않지만 이미지가 실제로 MS SQL Server CE 이미지 필드에서 나오고 있으며 해당 엔티티 필드는 실제로 바이트 배열입니다. 그러나 그것은 잘 작동합니다.

그런 다음 이미지 주위에 간단한 둥근 테두리를 두어 더 좋아 보이도록 결정했습니다. 첫 번째 시도는 테두리와 이미지가있는 캔버스를 사용하는 것이었지만 정사각형 이미지는 테두리의 둥근 부분 위에 페인트됩니다. 약간의 외모를 한 후에, 나는 당신이 실제로 국경의 배경으로 이미지를 페인트 할 수 있음을 알았습니다. 이것이 제가 생각해 낸 것입니다.

<Border Height="100" Width="100" BorderBrush="Gray" CornerRadius="10" BorderThickness="5">
    <Border.Background>
        <ImageBrush>
            <ImageBrush.ImageSource>
                <BitmapImage StreamSource="{Binding Converter={StaticResource ImageConverter}, Path=Image}"/>
            </ImageBrush.ImageSource>
        </ImageBrush>
    </Border.Background>
</Border>

내 문제는 XML 구문 분석 오류가 발생하여 Urisource 또는 StreamSource를 설정해야한다고 말하는 것입니다. 스트림 소스를 설정하고 있습니다. 또한 Urisource를 설정하려고 시도했지만 (동일한 문제가 발생했지만 Urisource를 사용하는 비슷하지만 반대의 문제를 발견했습니다) 같은 문제가 발생했습니다.

실행되지만이 이미지를 참조하려고 할 때 실패합니다.

실제로 나는 모서리 위에 이미지 그림없이 이미지 주위에 둥근 테두리를두고 싶다. 완전히 다른 방법이 있다면, 그것은 또한 작동합니다.

바라건대 이것은 의미가 있습니다!

안부, 마이크

도움이 되었습니까?

해결책 2

나는 이것에 꽤 오랫동안이 문제를 겪었고, XAML에 익숙하지 않은 경우, 솔루션을 찾는 데 훨씬 더 편안한 C ++에서 솔루션을 찾고있는 것보다 더 오래 걸립니다.

그러나 그렇듯이, 나는 질문을 게시 한 후 5 분 후에 문자 그대로 해결책을 찾을 수 있었으며 여기에 있습니다.

<Grid Grid.RowSpan="5">
    <!-- Rounded mask -->
    <Border Name="Mask" Background="White" CornerRadius="7"/>

    <StackPanel Width="100" Height="100" HorizontalAlignment="Center" VerticalAlignment="Top">
        <StackPanel.OpacityMask>
            <VisualBrush Visual="{Binding ElementName=Mask}"/>                        
        </StackPanel.OpacityMask>

        <Image Name="imgPlayer"                           
               Source="{Binding Converter={StaticResource ImageConverter}, Path=Image}" 
               MouseLeftButtonDown="Image_MouseRightButtonDown"
               />
    </StackPanel>
</Grid>

이 코드는 이미지의 모서리 또는 StackPanel 내부의 모든 것을 둥글게 처리합니다. 자세한 내용은이 불투명 장점을 조사 할 것이지만 트릭을 수행하는 것 같습니다. 원한다면 하나 이상의 경계를 그 주위에 넣을 수 있습니다. 매우 멋지다.

안부, 마이크

다른 팁

당신이 할 수있는 것은 같은 위치에 이미지와 테두리를 만드는 것입니다. 테두리가 이미지가 오버레이됩니다. 즉

        <Grid>
            <Image Name="imgPlayer" Width="100" Height="100" Source="{Binding Converter={StaticResource ImageConverter}, Path=Image}" />
            <Border Width="100" Height="100" BorderBrush="Gray" CornerRadius="10" BorderThickness="5" Background="Transparent" />
        </Grid>
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top