none
Unexpected border around SmallLogo tile asset

    Question

  • I do not want any kind of space or border around the images I use for my app's tile assets. I have included images for the 150x150, 30x30, and 50x50 tile sizes in my Package.appxmanifest. The tile on the Start Screen looks great, but the tile in the app list (the smaller tiles) has a border (the background color) instead of having the tile use the whole space. How can I make, or what tile size do I need to include, to make the tile use the whole square in the app list? Thanks.


    Nathan Sokalski njsokalski@hotmail.com http://www.nathansokalski.com/

    Monday, September 8, 2014 7:13 PM

Answers

  • First thing you are using tiles image  have different colours which is against the design principle of windows app development.

    It is recommended that tiles should have one solid colour and icon image on them .

    You tile background colour is Blue and Gray and images appear in small tiles only centre just as we splash screens contain image at centre and rest it contains background colour.

    The best way to solve is used tiles which have solid colour  and icon image at centre , define background colour same which your tiles contain.

    Defines your tiles in such way with  for all mentioned sizes.

    Thanks 

    Monday, September 15, 2014 8:48 PM
  • Hi

    yes there is no workaround and you image title image which appear at the centre 

    of tile and rest tile is occupied by back ground colour and tiles with single colour background having icon at centre will appear like as I show you picture above.

    You have to define background colour with same colour you used for tile colour background.

    Marks this answer, if you find this helpful 

    Tuesday, September 16, 2014 9:57 AM

All replies

  • Hello Nathan,

    I believe the information in this article may help. Take a look at the "Details on sizing, padding, scaling..." for in depth instructions. Thanks for the post!

    -Jonathan


    Windows and Windows Phone Dev Center Support

    Office Store Developer Support

    Send us your feedback about the Windows Platform

    Friday, September 12, 2014 7:21 PM
    Moderator
  • That article lists each asset with an asset, padding, and logo size, where the asset is the sum of the other two. I am assuming that the asset's size is what my image file should be, so what exactly do the padding and logo sizes mean? I want my tiles to have a padding of 0, so what do I need to do when I upload my files to the manifest? Thanks.

    Nathan Sokalski njsokalski@hotmail.com http://www.nathansokalski.com/

    Sunday, September 14, 2014 2:51 AM
  • Hi Nathan 

     In app list if  your are using images to display tiles images then set the "Stretch property of image equals to fill".

     eg

    In XAML

    <image x:Nam="myimage" stretch = "Fill"  /> 

    Monday, September 15, 2014 2:02 PM
  • XAML is not involved in my problem, I am talking about the *.png files used for the Visual Assets in Package.appxmanifest.

    Nathan Sokalski njsokalski@hotmail.com http://www.nathansokalski.com/

    Monday, September 15, 2014 4:15 PM
  • Hi 

    You have to set background colour in Package.appxmanifest. same as you define background colour for  your splash screen.

    Best approach is you define same background colour which your tiles hold . By default this colour is Gray and it show Gray border around the tiles image.


    if you find this helpful mark this answer 

    Thanks


    • Edited by Faizan Amjad Monday, September 15, 2014 6:21 PM
    • Proposed as answer by Faizan Amjad Monday, September 15, 2014 6:29 PM
    Monday, September 15, 2014 6:16 PM
  • That does not solve the problem. The problem is that there is a border at all, not what color it is. The background color should not matter, because the *.png should take up the entire area, therefore the background will not be visible. What I am trying to say is that I want complete control over what the tile looks like, but I am only being given control over part of the area displayed by the tile.

    Nathan Sokalski njsokalski@hotmail.com http://www.nathansokalski.com/

    Monday, September 15, 2014 6:52 PM
  • Can you share snap shot of tile  images  here?
    Monday, September 15, 2014 7:00 PM
  •  


    Nathan Sokalski njsokalski@hotmail.com http://www.nathansokalski.com/

    Monday, September 15, 2014 7:43 PM
  • First thing you are using tiles image  have different colours which is against the design principle of windows app development.

    It is recommended that tiles should have one solid colour and icon image on them .

    You tile background colour is Blue and Gray and images appear in small tiles only centre just as we splash screens contain image at centre and rest it contains background colour.

    The best way to solve is used tiles which have solid colour  and icon image at centre , define background colour same which your tiles contain.

    Defines your tiles in such way with  for all mentioned sizes.

    Thanks 

    Monday, September 15, 2014 8:48 PM
  • So are you saying that there is no workaround, and that I am not actually allowed to use the amount of space specified? I was surprised about this, because apps that do not have recognizable icons, logos, or some type of symbol to make them easily recognizable might be hard to quickly pick out from the all apps list without the full specified size. What I am saying is that for tiles like the ones in your screenshot, the tiles are a single color and they have easily recognizable symbols. Some apps do not, which is why I wanted to use the full size for my tiles. But it is good to know what is available, so thank you for the clarification. Thanks.

    Nathan Sokalski njsokalski@hotmail.com http://www.nathansokalski.com/

    Monday, September 15, 2014 9:51 PM
  • Hi

    yes there is no workaround and you image title image which appear at the centre 

    of tile and rest tile is occupied by back ground colour and tiles with single colour background having icon at centre will appear like as I show you picture above.

    You have to define background colour with same colour you used for tile colour background.

    Marks this answer, if you find this helpful 

    Tuesday, September 16, 2014 9:57 AM
  • Just one final question. If I am going to be restricted to using a specific amount of space by having my image scaled in size, is there a way to upload an image that is smaller so that it is displayed the same size just with the border added? I think I am slightly confused about exactly what it does to the image between the time it is uploaded and displayed. Thanks.

    Nathan Sokalski njsokalski@hotmail.com http://www.nathansokalski.com/

    Tuesday, September 16, 2014 3:48 PM
  • Just upload image having mentioned size  , which have solid singe colour and also define same  colour in background . 

    it will solve your issue.

    Thanks

    Tuesday, September 16, 2014 4:32 PM