Tutorial for 9-patch image

9-patch image
For full description of the 9-patch check 9-patch image chapter. 
 BitmapNode sample 
 
 Import an image in Solution Explorer window.  
 
 
 To configure the image as a 9patch image, click on my_image from the Solution Explorer window and change in the Properties window Bitmap -> Bitmap Layout from Stretch to NinePatch. 4 additional properties are available Bitmap -> 9-patch Stretchable Area: Left, Top, Right and Bottom. These properties define the distance in pixel from the border.  
 
 
 Drag the image from the Solution Explorer window in the Scene Tree window into Scene2D.  
 
 
 In order to have sharp borders, click on my_image from the Scene Tree window, then click on BitmapBrushBlend and change in the Properties window Filter from BilinearFilter to NereastFilter.  
 
 
 To resize a 9patch image, click on my_image from the Scene Tree window and change in the Properties window Layout -> Size X and Y values. 
 
 Default X, Y values
 
 
 
 
 
 
 
 
 
 
 
 
 
 Changed X, Y values 
 
 
 
 
 
 
 
 
 
 
 If (X < Left + Right) or (Y < Top + Bottom) where Left, Top, Right and Bottom are the 9-patch Stretchable Area, then the borders themselves will also start scaling down.