microsoft / microsoft-ui-xaml

Windows UI Library: the latest Windows 10 native controls and Fluent styles for your applications
MIT License
6.33k stars 675 forks source link

Shape filling with wrapped image #4527

Closed devlers closed 1 year ago

devlers commented 3 years ago

Hi,

Is there possibility to fill shape with wrapped (not stretched) image? I mean small image would be multiplied and filled whole shape. Is there plans to add this functionality or suggestion what would best approach to achieve this?

Thanks, Saulius

mrlacey commented 3 years ago

Is there possibility to fill shape with wrapped (not stretched) image? I mean small image would be multiplied and filled whole shape. Is there plans to add this functionality or suggestion what would best approach to achieve this?

Can you provide an example of what you mean by this? Is this like tiling an image for a background and then clipping to a shape?

devlers commented 3 years ago

From from To to Exactly. Tiling small image to fill all shape background.

mrlacey commented 3 years ago

Can't you use a TileBrush? Or from the Community Toolkit?

andrewleader commented 3 years ago

Transferring to WinUI repo

StephenLPeters commented 3 years ago

@marlenecota I think I remember you doing this for ReactNative. Do you know how to do it in xaml?

StephenLPeters commented 3 years ago

@codendone FYI

marlenecota commented 3 years ago

In react-native-windows it was done using XamlCompositionBrushBase and Win2d's BorderEffect (setting both ExtendX and ExtendY to Wrap).

Here's react-native-windows code: https://github.com/microsoft/react-native-windows/tree/master/vnext/Microsoft.ReactNative/Views/Image

ReactImageBrush is the XamlCompositionBrush and we used a header only implementation of the Border effect because we didn't to bring in all of Win2D.

github-actions[bot] commented 1 year ago

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 5 days.