Tile Images dans Silverlight Contrôle

Question

Avertissement: Silverlight/WPF n00b

Je commence juste regarder Silverlight. Il est devenu évident que les pinceaux ne sont pas compatibles avec Silverlight, contrairement à WPF. Je voudrais placer un graphique dans un contrôle de grille. L'image est essentiellement en mosaïque par cellule de la grille. Peut-on utiliser plusieurs pinceaux par contrôle, ou devrais-je utiliser beaucoup de contrôles d'image, ou?

Merci d'avance.

Answer 1

Jetez un oeil à ce lien ...

Silverlight 3.0: Tile Effect with a Pixel Shader

Answer 2

je devais suivre SL 2 pour ce projet, donc, malheureusement, les shaders ne sont pas une option. Mon contrôle avait une taille prédéterminée assez stricte, donc j'ai manuellement mis le graphique sur une toile plus grande.

Answer 3

Le meilleur moyen que j'ai trouvé jusqu'ici est de voler le contrôle du thème 'JetPack' de Microsoft.

Il fait partie du modèle de projet et fait du bon travail. Définissez simplement la propriété SourceUri et vous êtes prêt à partir.

est ici la source -

public class TiledBackground : UserControl 
{ 
    private Image tiledImage = new Image(); 
    private BitmapImage bitmap; 
    private int lastWidth, lastHeight = 0; 
    private WriteableBitmap sourceBitmap; 

    public TiledBackground() 
    { 
     // create an image as the content of the control 
     tiledImage.Stretch = Stretch.None; 
     this.Content = tiledImage; 

     // no sizechanged to override 
     this.SizeChanged += new SizeChangedEventHandler(TiledBackground_SizeChanged); 
    } 

    void TiledBackground_SizeChanged(object sender, SizeChangedEventArgs e) 
    { 
     UpdateTiledImage(); 
    } 

    private void UpdateTiledImage() 
    { 
     if (sourceBitmap != null) 
     { 
      int width = (int)Math.Ceiling(this.ActualWidth); 
      int height = (int)Math.Ceiling(this.ActualHeight); 

      // only regenerate the image if the width/height has grown 
      if (width < lastWidth && height < lastHeight) return; 
      lastWidth = width; 
      lastHeight = height; 

      WriteableBitmap final = new WriteableBitmap(width, height); 

      for (int x = 0; x < final.PixelWidth; x++) 
      { 
       for (int y = 0; y < final.PixelHeight; y++) 
       { 
        int tiledX = (x % sourceBitmap.PixelWidth); 
        int tiledY = (y % sourceBitmap.PixelHeight); 
        final.Pixels[y * final.PixelWidth + x] = sourceBitmap.Pixels[tiledY * sourceBitmap.PixelWidth + tiledX]; 
       } 
      } 

      tiledImage.Source = final; 
     } 
    } 

    #region SourceUri (DependencyProperty) 

    /// <summary> 
    /// A description of the property. 
    /// </summary> 
    public Uri SourceUri 
    { 
     get { return (Uri)GetValue(SourceUriProperty); } 
     set { SetValue(SourceUriProperty, value); } 
    } 
    public static readonly DependencyProperty SourceUriProperty = 
     DependencyProperty.Register("SourceUri", typeof(Uri), typeof(TiledBackground), 
     new PropertyMetadata(null, new PropertyChangedCallback(OnSourceUriChanged))); 

    private static void OnSourceUriChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) 
    { 
     ((TiledBackground)d).OnSourceUriChanged(e); 
    } 

    protected virtual void OnSourceUriChanged(DependencyPropertyChangedEventArgs e) 
    { 
     bitmap = new BitmapImage(e.NewValue as Uri); 
     bitmap.CreateOptions = BitmapCreateOptions.None; 
     bitmap.ImageOpened += new EventHandler<RoutedEventArgs>(bitmap_ImageOpened); 
    } 

    void bitmap_ImageOpened(object sender, RoutedEventArgs e) 
    { 
     sourceBitmap = new WriteableBitmap(bitmap); 
     UpdateTiledImage(); 
    } 

    #endregion 
} 

HTH.

Answer 4

Si la mosaïque souhaitée est un motif géométrique de base, une autre option consiste à créer des dégradés répétés.

rayures horizontales 1px ...

<LinearGradientBrush EndPoint="0,16" StartPoint="0,0" MappingMode="Absolute" SpreadMethod="Repeat"> 
    <GradientStop Color="Black" Offset="0"/> 
    <GradientStop Color="Black" Offset="0.062"/> 
    <GradientStop Offset="0.0625"/> 
</LinearGradientBrush>