Как отобразить часть изображения внутри фрейма в Xamarin.Forms - PullRequest
1 голос
/ 06 мая 2020

В Xamarin.Forms, как я могу отобразить только определенную c часть большего изображения (т.е. обрезать изображение) внутри фрейма?

Допустим, я, например, хочу отобразить правильное нижний квадрант, например:

Изображение:
Strandsnäckan Glass & Café

Кадр:
Frame

Часть, которую я хочу (например, правый нижний квадрант) :
Strandsnäckan & Frame

Для отображения (рамка с частью изображения внутри):
Strandsnäckan Right Lower Quadrant

Мой код (двойные рамки предназначены только для более толстых границ) :

<Frame BorderColor="#880014" BackgroundColor="#880014" Padding="4">
    <Frame BorderColor="#880014" BackgroundColor="#FFFFFF" Padding="0">
        <!--
        An Image something like this...
        <Image Source="{local:ImageResource SGC.Resources.SGCLogo.png}" Aspect="Fill" ... />
        -->
    </Frame>
</Frame>

1 Ответ

2 голосов
/ 06 мая 2020

Решением является использование <AbsoluteLayout> с пропорциональными значениями внутри <Frame>.

<AbsoluteLayout>
    <Image Source="{local:ImageResource SGC.Resources.SGCLogo.png}"  
                   AbsoluteLayout.LayoutBounds="1, 1, 2, 2"  
                   AbsoluteLayout.LayoutFlags="All"  
                   Aspect="Fill"/>  
</AbsoluteLayout>

Установите LayoutFlags для обработки всех значений как Proportional:
AbsoluteLayout.LayoutFlags="All".

И используйте LayoutBounds , чтобы установить Proportional значения для «X, Y, Ширина, Высота», например: (AbsoluteLayout.LayoutBounds="1, 1, 2, 2")

Где «1, 1 ...» - правый нижний квадрант.
(используйте «0, 1 ... "для левого нижнего квадранта) :

enter image description here

И« ... 2, 2 »обрезает изображение до 1 / 4 его размера (два столбца и две строки).
(используйте "... 8, 8" для размера изображения 1/64 или "... 2, 4" для размера 1/8, как это ) :

enter image description here

...