tiling the background of a widget with an image, pixel-perfect

151 views
Skip to first unread message

Bill Janssen

unread,
May 4, 2017, 12:10:30 PM5/4/17
to Kivy users support
I just added a wiki page on how to do this.  Couldn't find a succinct explanation anywhere in the documentation.

https://github.com/kivy/kivy/wiki/Tiling-the-background-of-a-wdget-with-an-image,-pixel-perfect

Bill

xinming

unread,
May 6, 2017, 11:02:15 AM5/6/17
to kivy-...@googlegroups.com
Hi, Bill, I think your work is quite great! now, I want to reference your code to implementing a hexagonal grid. Would you kind to give me some suggestions? My code is 

from kivy.app import App
from kivy.core.image import Image as CoreImage
from kivy.uix.label import Label
from kivy.graphics import Rectangle
from kivy.core.window import Window

class MyLabel(Label):

def __init__(self,**kwargs):
super(MyLabel,self).__init__(**kwargs)
with self.canvas:
texture = CoreImage('grass_01.png').texture
texture.wrap = 'repeat'
nx = self.width / texture.width + 1
ny = self.height / texture.height
for i in range(int(2*ny)):
if i % 2 == 0:
x = -texture.width/2.0
elif i % 2 == 1:
x = 0
y = (i-1)*texture.height *3/4.0
Rectangle(pos=(x, y),
size=(self.width + texture.width, texture.height),
texture=texture,
tex_coords=(0, 0, nx, 0, nx, 1, 0, 1))




class MyApp(App):
def build(self):
return MyLabel(size=Window.size)


if __name__ == '__main__':
MyApp().run()

the result seemed OK, but I am not sure the black line along the row is normal, and no black line between the coloumn, I want to know is there any direct way to implementing a hexagonal grid in kivy? I am quite new to kivy, is it OK to use Mesh or other VertexInstruction to do it and how?  Thank you in advance.
Simon

--
You received this message because you are subscribed to the Google Groups "Kivy users support" group.
To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.


 

grass_01.png

ZenCODE

unread,
May 6, 2017, 1:12:30 PM5/6/17
to Kivy users support

Bill Janssen

unread,
May 6, 2017, 3:26:17 PM5/6/17
to Kivy users support
That's ingenious!  Don't think I'd have thought of that.  I'd use a Widget instead of a Label, though -- why the Label?  The "black" line is an effect of the antialiasing of the diagonal edges of your image -- the two different anti-aliasing artifacts are interfering with each other in that pattern.  The sides of your grass image don't have antialiasing, which is why the lines don't show up there.

Yes, considering how many games are written in Kivy, and how many games use hex tiles, I'd suspect a Hexagon graphic instruction would be a good thing to have.  Wonder how hard it would be to implement?  You're thinking of a Mesh with six vertices?  Should be doable.

Bill

xinming

unread,
May 6, 2017, 8:56:00 PM5/6/17
to kivy-...@googlegroups.com

Thank you ! In fact I do not know why I use Label :) I should use Widget, I just find it is interesting to do hex tiles, and I follow this tutorial http://www.redblobgames.com/grids/hexagons/. Yeah, I will keep trying though only a few game use hex tiles, just for fun !  :)Thank you!

Bill Janssen

unread,
May 7, 2017, 8:49:04 PM5/7/17
to Kivy users support
That's a great tutorial, thanks for the pointer!

Bill
Reply all
Reply to author
Forward
0 new messages