Where to start on graphics?

[Floepke]

Out of hobby and curiosity I created a (for me) complicated program that can engrave a alternative music notation called ‘PianoScript’. Also out of curiosity I want to rewrite the program in crystal to see performance differences and learn something new. But where to start?

I am aware that this is going to take much time since the creation of PianoScript took me about two years…

To make the problem small: Let’s say I only want to draw a white canvas with a line on the screen. What should I know to make a program that only displays a line on a canvas in Crystal?

Connected question:

• What is THE place where crystal stores libraries created by other users? There seem to be many github places/projects and I found ‘libhunt’ and ‘crystalshards’. All the movements are very well intended() but what is the central place according to crystal-lang.org? (like python does have pypi as the way to search for helping libraries) Kind of lost…

[jwoertink]

For me, I’d probably look at crsfml@2.5.2 on Shardbox or sdl@HEAD on Shardbox just because I think using these make more sense to me. But there’s also imgui@HEAD on Shardbox and hedron@HEAD on Shardbox or maybe cru@HEAD on Shardbox … Those seem to use libui which you might be able to dig in to for some ideas. I think I’ve seen a few shards using GTK, but I can’t find them now…

[Floepke]

Looks good! How do you basically add a library to your project. Do you require the source file? I have no clue how to get for example thisone working. Where can I read information about installing/adding a library? Or can you give an example/step guide?

Glass looks promising and maybe I will contribute someday…

[jwoertink]

To start with that, you’ll run your normal crystal init app piano_script. Then in the generated shard.yml file, you’ll add

dependencies:
  glass:
    github: nilsmartel/Glass
    branch: master

edit: then run shards install to install the dependencies.

From there, you’ll have a src/piano_script.cr file where you add your require "glass". At that point you should have access to all of the Glass related stuff!

[RespiteSage]

Oh, and you’ll also need to run shards install to actually download the dependencies. You can read more in the shards manual.

[jwoertink]

Oops! Good call

[Floepke]

I did everything you said and ahhh now I begin to understand the lib system! But I ran into an error:
shards install

Resolving dependencies
Fetching https://github.com/nilsmartel/glass.git
Fetching https://github.com/oprypin/crsfml.git
Installing crsfml (2.5.2)
Postinstall of crsfml: make
Failed postinstall of crsfml on make:
g++ -Wno-deprecated-declarations -I '/usr/include'  -o src/system/ext.o -c src/system/ext.cpp
src/system/ext.cpp:1:10: fatal error: SFML/System.hpp: No such file or directory
    1 | #include <SFML/System.hpp>
      |          ^~~~~~~~~~~~~~~~~
compilation terminated.
make: *** [Makefile:21: src/system/ext.o] Error 1

It’s seems it’s missing System.hpp. Do I need to update something?

[RespiteSage]

Oh, do you have sfml installed on your machine? For example, in my package manager it’s listed as sfml2-devel.

[Floepke]

Thank you I googled sfml and now in succesfully installed the depencies! But it still doesn’t work. I changed in the .yml glass to Glass because otherwise the module won’t install. I get the error : Error: can’t find file ‘Glass’, while Glass is in the lib folder.

shard.yml

name: piano_script
version: 0.1.0

authors:
  - Philip Bergwerf <philipbergwerf@*****.com>

targets:
  piano_script:
    main: src/piano_script.cr

crystal: 1.1.0

license: MIT

dependencies:
  Glass:
    github: nilsmartel/Glass
    branch: master

I ran shards install before testing and it completed with no errors. Also in the lib folder are crfsml and Glass.
My test code from the Glass gh page:

# TODO: Write documentation for `PianoScript`
require "Glass"

def new_ui() : Glass::Widget
  img = SF::Image.new(256, 256)
  ui = Glass::AbsolutContainer.new(img)
  ui.background_color = SF::Color.new(64_u8, 64_u8, 64_u8)
  container = Glass::VerticalContainer.new()
  container + Glass::Example.new(128_u8, 64_u8, 32_u8)
  container + Glass::Example.new(32_u8, 128_u8, 64_u8)
  container + Glass::Example.new(64_u8, 32_u8, 128_u8)
  ui + container
  ui
end

widget = new_ui

window = Window.new "Glass Window", widget

window.run

Both glass and Glass don’t work. I there something suspicious? I am assuming that piano_script.cr is the main program file?

[jwoertink]

This one might be a bit funky since it looks like the dev on the project isn’t using the standard naming convention with all lower case and such… With that said, my guess is you may need to do

require "Glass/Main"

Based on the main file being Glass/Main.cr at master · nilsmartel/Glass · GitHub

But that’s just a guess. If that doesn’t work, it might be just sort of playing around with the casing stuff.

[RespiteSage]

Also, it just might not be what you’re looking for. The readme says “Note: this is heavily W.I.P. and no useful functionality has been exposed yet”.

[Floepke]

strange I passed the path directly using require "../lib/Glass/src/Main" and now it gives the same error for the ‘crsfml’ library. Glass depends on that. I want to make sure I am doing everything right. I know there is a possibillity that Glass doesn’t work correct.
shard check says Dependencies are satisfied

[Floepke]

I know that but My orginal question was: Making a program that only draws a line on a canvas. It looks like you can draw something with this

[Floepke]

If you are requiring something like so: require "libblablabla" How can it ever see that file if the lib is in the lib folder? I am assuming that require does look in the same folder as the file it’s written in.

[jwoertink]

Crystal has a built-in set of rules when it comes to the lookup. I forget the order off the top of my head, but it’s something like require "mylib" first looks in ./lib/mylib/src/mylib.cr, then it looks in some other places. So even though your file is in src/piano_script.cr, it’s based off the lib directory in your current directory. I’ll see if I can find a link. I remember seeing another dev post a list of the require orders.

If Crystal can’t find the file in one of the normal spots, then it’ll throw the error saying it can’t find it.

[Floepke]

I will try some other random lib to test if the same happens out of the box. Thank you all for replying!

[jwoertink]

Sure thing. Here’s the reference Requiring files - Crystal

Hopefully that clears it up. Also feel free to hop in the Crystal Discord chat! Might be quicker to get some responses

[hugopl]

I’m working on GTK4 bindings for Crystal GitHub - hugopl/gtk4.cr: GTK4 bindings for Crystal, still incomplete since I’m implementing things in the generator while porting my app from GTK3 to GTK4, so I fix issues when someone (currently just myself ) find/need them, so most (all) fixes go into the binding generator GitHub - hugopl/gi-crystal: Tool to generate Crystal bindings and user API for glib-based libraries

For GTK3 (and also 4) there’s also GitHub - jhass/crystal-gobject: gobject-introspection for Crystal that should work. I was using/contributing to it until I decided to write a generator using a sightly different approach.

[hugopl]

ah, and GitHub - hugopl/gi-crystal: Tool to generate Crystal bindings and user API for glib-based libraries should work with GTK3, I just never ran it to generate GTK3 bindings.