Inkscape.org
Creating New Extensions New extension! Tiling patterns
  1. #1
    Chris Want Chris Want @cwant
    *🔧

    Hi all,

    [UPDATE] See zip file a few posts below if you don't want to check the code out from git. 

    I'm the author of a library for creating tiling patterns of 3D surfaces called Tessagon (and if you can tile in 3D you can tile in 2D too!).

    So I've written an extension to draw tiling patterns via a user interface in Inkscape. Hope it works for somebody other myself, you can get it here (by following the installation instructions):

    https://github.com/cwant/inkscape-tiling-extension

    You can use it to make nice backgrounds, cool non-standard graph paper, or whatever else you can think up.

    You can find out more about the Tessgon library here: https://github.com/cwant/tessagon

    Regards,

    Chris

  2. #2
    inklinea inklinea @inklinea⛰️

    Hello Chris. 

    This works great for me on Ubuntu 23 and on Window 10. 

    I didn't use git to pull it, I used 'download zip' on the inkscape-tiling-extension, and the 'download zip' on the tessagon page. ( the placed tessagon as a subfolder )

    I think 99% of people who want to use this ( for artwork ) would not be able to use git to recursively pull it or to do the manual steps above. 

    Would be nice to see this on the inkscape.org website for download, but would need to be a complete package ( which I think comes to about 10.5mb ) so it works out of the box (zip).

    Great work !

     

    Screenshot From 2023 07 04 08 16 23
  3. #3
    Chris Want Chris Want @cwant

    Thanks for your comments, your advice is much appreciated. Although I'm a long time Inkscape user, I'm pretty new to extensions (both as a user, and as a coder). I'll take a look into some more friendly packaging options. (My first time using git submodules ... and they are not a lot of fun.)

    Regards,

    Chris

     

  4. #4
    Hum Hum @Hum
    *

    This sounds like a great work and contribution. 

    Thank you, Chris.

    Unfortunately, I cannot find the zip files that Inkinea us referring to. Can someone share those  zip files mentioned above? Or a direct link to each one?

    Thank you very much.

    (When I attempt to find the files mentioned by Chris and download them, they come out as mhtml files. Not inx or py files.)

  5. #5
    Polygon Polygon @Polygon🌶

    @Hum look up here:

  6. #6
    Hum Hum @Hum

    Thank you, Polygon. I am using an Android phone in an attempt to find and download this. I see the Code area shown but no zip file of any kind shows for ne. When I go to the "Go to File" button (link) and actually try to download from there, the results are mhtml files. I do not know wy I am not able to see nor download any download,zio file. Curious. Thanks for any help and what you have shares already.

  7. #7
    Chris Want Chris Want @cwant

    Hi Hum,

    I've worked on packaging this thing up a little better (please see attached zip file).

    In particular, everything gets bundled in one archive, the Tessagon project is only taking the files it needs, and the python files are minified (I'm into long variable names and verbose comments -- great for dev work, not good for distribution).

    This makes for a 108k zip file (229k when decompressed).

    Let me know if it works for you (decompress in your extensions directory).

    I'll look at getting it officially submitted to the website soon (could use some user feedback first).

    Regards,

    Chris

     

  8. #8
    Hum Hum @Hum
    *

    Thank you, Chris. I downloaded  and installed your shared zip file.

    I use Windows 10.

    This works great and is a very welcome addition to the extensions  family. Super work!

  9. #9
    Chris Want Chris Want @cwant

    Update: You can download the extension on the inkscape website here:

    https://inkscape.org/~cwant/%E2%98%85inkscape-tiling-extension+2

    Also, if you'd like an up to date version (e.g., with new tiling patterns), you can always build a development version of the extension from the tessagon source code:

    1) Download (and extract) the development version of tessagon from here: https://github.com/cwant/tessagon/archive/refs/heads/development.zip

    2) In the source tree, run a script to generate the extension (both in it's own directory, and as a zip):

    cd integrations/inkscape/
    python3 package_extension.py
    # The built extension will be in the output directory
    

     

  10. #10
    David248 David248 @David248

    Hi Chris,

    For muggles, like me, github structure is really difficult to understand.

    I understood from polygon's post that I had to download zip using the green "code" button.

    I tried to do the way you describe in your last post but failed  : I did install python3, but when opening a terminal in the proper directory (the dezipped file) and entering the two code lines, windows failed to run python.

     So I tried the first link you gave, downloaded zip and just created a new folder in my inkscape extensions directory and copy-pasted there Tessagon folder and tiling.inx and tiling.py

    It works that way, I hope I didn't make any mistake.

     

     

     

  11. #11
    Chris Want Chris Want @cwant

    Hi David, thanks for giving it a try, glad you got something working there. Probably for most folks, just downloading the zip directly from the extension page is the best idea ("It just works").

    For running the python script to generate a new version of the extension, unfortunately I don't know a lot about how things work on Windows. Was there a specific error? ("File not found", "Python not found", etc.)

    One thought, maybe you can find the package_extension.py script (integrations/inkscape directory) in Windows explorer, and right click it. There might be an option in the menu that pops up that says "Run this with Python" (or similar).

    Have a great day,

    Chris

     

  12. #12
    David248 David248 @David248
    *

    Yes, that's it : I got this message : "Python not found"

    There is no package_extension.py script in the tessagon-main\integrations\inkscape directory, this perhaps explains my issues 😁

    I tried double-cliking on setup.py, in tessagon-main. A black window popped and vanished immediatly (python, I guess), with no result on the extensions folder of inkscape.

    Thanks for your reply and this great extension 🤩. The screenshots for blender are just awesome !

    I won't have the masochist pleasure to design islamic patterns : now, you've done the job...

    PS : (perhaps it's already done) : you could precise that the extension will be found under the Extensions>Render>Tiling menu

  13. #13
    Chris Want Chris Want @cwant

    Hi David, you might be getting close ...

    * From this zip file: https://github.com/cwant/tessagon/archive/refs/heads/development.zip (after downloading and extraction) direct Windows explorer into the tessagon-development/integrations/inkscape directory

    * Try double clicking on the package_extension.py script (that setup.py script you clicked previously is just for packaging tessagon for distribution via the python package index, not important here). It will be normal for the black terminal to pop up then disappear (or show up with some writing in it).

    * If things worked, there will be an output directory in that same directory ... look in there for the extension (a directory called inkscape-tiling-extension should be sufficient to use, but it should also zipped up as inkscape-tiling-extension.zip.

    I think currently there are just two additional patterns in the development version than the one that is downloaded from here (both created about 200 years ago by Japanese artist Hokusai):

    @cwant/110664980753072051">https://mathstodon.xyz/@cwant/110664980753072051

    @cwant/110682018497500029">https://mathstodon.xyz/@cwant/110682018497500029

    Regards,

    Chris

  14. #14
    Chris Want Chris Want @cwant

    Time to report some new features in development: post-processing options!

    These are in a new post-processing tab. A lot of these options produce random deviations from the base tilings and colors, which can create cool, kitchy looking effects.

    Attached is an updated zip of the development extension if you'd like to try things out.

    Chris

    Slats Inkscape Randomize
    Florets Inkscape Randomized
  15. #15
    David248 David248 @David248

    Nice !

  16. #16
    David248 David248 @David248
    *

    Thanks for your work, Chris

    A few thoughts on the Fill Options Tab : (I'm not an extension designer, sorry if some ideas sound silly or impossible to do).

    • I'm not sure that the "select" button is mandatory : I feel it is counter-intuivitve to use : it would be great to pick a color and immediately see the effect on live preview, without having to click on select.
    • It would be also interesting, when choosing colors with "Color pattern" fill type to automatically resize the number of lines / color : for example with the last pattern (hashes by hokusai) : only two lines, or a message indicating that only two colors may be adjusted.
    • It would be nice to use a color selector similar to the color selector of the fill and stroke panel, which users are more familiar with.

    PS : Thanks for sharing Hokusaï's book on BNF : a true goldmine !

    Rect3
  17. #17
    Chris Want Chris Want @cwant

    Hi David,

    Wow, I love that Tiling image!

    Thanks for the feedback, it's very helpful. When I originally started developing this, for the colors I stole borrowed some code that used something called a "colorbutton", which is what the color picker has been using. I have now discovered that there is something called "color" that renders the color controls directly in the extension window, and allows the live preview to work. The downside is that these take up a lot of space (and there are 8 or them, which leads to a long screen (with no scroll bars, which is not usable). No problem though, since I can put each color in it's own tab, and that works pretty well (see picture).

    Unfortunately I don't have a lot of choices for the dynamic resizing of the controls based on how many color patterns, etc. (You'll see a few recent threads about the topic of dynamic GUIs in the forum). There are some ways around this (e.g., GTK), but as far as I can tell, you lose "live preview" when you use them. I wish there was some way to add some logic to the current INX-based GUI system (e.g., if "Hex" selected, then only show 4 color patterns in the GUI), it would really solve a lot of bad UX problems with this extension.

    New version of the extension attached, if you want to try it out with the alternate color picker (I think this will likely become the default).

    Thanks again,

    Chris

    New Color Picker
  18. #18
    David248 David248 @David248
    *

    Thanks Chris !

    The new color selector is very satisfying. You did perhaps notice it : there is an issue with the Dropper tool included in the extension dialog (I mean the small dropper icon bottom left) :

    • if live preview is'nt enabled, when you click on the icon a pick a color on canvas, the extension dialog vanishes (I need to press alt tab to recover the dialog), but the color is picked.
    • if live preview is enabled, you can click on the icon and then on canvas, nothing happens (the color isn't picked, but "good news", the dialog doesn't move to background of the screen).

    Another issue with svg_adaptor.py, I guess

    Traceback (most recent call last):
      File "C:\Users\Terra\AppData\Roaming\inkscape\extensions\inkscape-tiling-extension\tiling.py", line 216, in <module>
        Tiling().run()
      File "C:\Program Files\Inkscape\share\inkscape\extensions\inkex\base.py", line 250, in run
        self.save_raw(self.effect())
      File "C:\Users\Terra\AppData\Roaming\inkscape\extensions\inkscape-tiling-extension\tiling.py", line 109, in effect
        group = self.draw_tessagon_group(self.options)
      File "C:\Users\Terra\AppData\Roaming\inkscape\extensions\inkscape-tiling-extension\tiling.py", line 205, in draw_tessagon_group
        svg = this_tessagon.create_mesh()
      File "C:\Users\Terra\AppData\Roaming\inkscape\extensions\inkscape-tiling-extension\tessagon\tessagon\core\tessagon.py", line 8, in create_mesh
        def create_mesh(A):return A.xyz_mesh_maker.create_mesh()
      File "C:\Users\Terra\AppData\Roaming\inkscape\extensions\inkscape-tiling-extension\tessagon\tessagon\core\xyz_mesh_maker.py", line 25, in create_mesh
        return A.mesh_adaptor.get_mesh()
      File "C:\Users\Terra\AppData\Roaming\inkscape\extensions\inkscape-tiling-extension\tessagon\tessagon\adaptors\svg_adaptor.py", line 32, in get_mesh
        B+=A.make_faces();B+='</g>\n'
      File "C:\Users\Terra\AppData\Roaming\inkscape\extensions\inkscape-tiling-extension\tessagon\tessagon\adaptors\svg_adaptor.py", line 38, in make_faces
        for D in range(len(A.face_list)):C=A.face_list[D];E=A.color_list[D];F=A.svg_fill_colors[E];B+=A.make_face(C,F)
      File "C:\Users\Terra\AppData\Roaming\inkscape\extensions\inkscape-tiling-extension\tessagon\tessagon\adaptors\svg_adaptor.py", line 51, in make_face
        if A:A=B._randomize_color(A);C='style="fill:{};"'.format(A)
      File "C:\Users\Terra\AppData\Roaming\inkscape\extensions\inkscape-tiling-extension\tessagon\tessagon\adaptors\svg_adaptor.py", line 56, in _randomize_color
        H=_hex_to_rgb(G);D,E,F=rgb_to_hsv(*H)
      File "C:\Users\Terra\AppData\Roaming\inkscape\extensions\inkscape-tiling-extension\tessagon\tessagon\adaptors\svg_adaptor.py", line 15, in _hex_to_rgb
        for B in(1,3,5):C=int(hex[B:B+2],16);A.append(C/255)
    ValueError: invalid literal for int() with base 16: 'gb'

     

  19. #19
    Marcos González Marcos González @mrks9

    @cwant I just downloaded and tested it. Excellent contribution, thank you so much 💯

  20. #20
    Chris Want Chris Want @cwant
    *

    Thanks @mrks9!

    Thanks again @David248 for the feedback. The buggy color picker seems to be an inkscape bug (although I don't have the issue you have where the tiling dialog goes beneath the main window -- running Inkscape 1.3 here, maybe that's the difference?).

    Thanks for posting the backtrace, it's very helpful. It looks like if you ask for a full opacity color, inkscape gives the extension a hex representation for the color (e.g., #895d40), but if you ask for some opacity, inkscape gives something like `rgba(255, 137, 45, 0.5)` ... my script wasn't expecting that. Worse, although my browser can handle various ways of specifying opacity, inkscape seems to only want an explicit "fill-opacity" attribute, or the filled color just shows up black.

    Anyways, think I've got it all sorted out now (updated extension attached)

  21. #21
    David248 David248 @David248

    Hello Chris

    This last version doesn't get the error message described in my last post, thanks 🤗

    Another minor bug (coming from insckape, not the extension, I guess) : when using HSL wheel, clicking on wheel does not always lead to a refreshing of live preview : the first modification on wheel does update livepreview, the next modifications don't (but the right color values HSL are refreshed under the wheel and the new RGBA coding also) : to force refreshing, you have to use the sliders on any HSLA bar. The same problem seems to occur if you manually enter values or use +/- buttons. Doesn't seem to occur with the other color coding contexts (RGB / CYMK...)

    Concerning the very interesting post-processing Options Tab :

    • I think it would be very interesting to have help messages or a clearer text for the post processing tab : sorry but it is not very understandable. You (I can contribute if you wish) could design small icons to illustrate what will be changed.
    • A reset button (to default settings) would be useful : I did many changes and I'm now a bit lost...
  22. #22
    Chris Want Chris Want @cwant

    Hi David, thanks for the comments (and sorry for the slow response, summer+kids means that I don't always get to be the weird dad working on tiling patterns in the basement).

    I'd be interested to know which post-processing options could use clarification (it's really good to have somebody other than me look at these things for fresh perspective). I'd also be interested to know what ideas you have for icons (and I have to be careful here because the extension is already relatively large in size, so would want to keep that in mind when including extra files with the project).

    I wish there was a reset button. At the risk of sounding like a broken record: "That's an Inkscape issue".

    I did notice that the settings do get cached in the XML preferences file, on my machine that's at ~/.config/inkscape/preferences.xml. A sledgehammer way to do a reset would be to delete the lines that have math.tiling in them. For the post processing panel, anything that involves scaling has a default of 1.0, everything else has a default of 0.0.

    Cheers,

    Chris

     

  23. #23
    David248 David248 @David248

    Hi Chris :

    How would you describe for muggles ?

    • Vertex offset radius
    • Polygon offset radius

    It would be interesting to simply Title something as HSV color randomization for the last part of the window

    BTW : if you play with HSV randomization controls and reset all them to 0, the polygons get black and I did'nt manage to get them coloured again without adding a slight randomization (0.01) somewhere on H, S or V controls.