Project-Bitle Devlog-0

Project-Bitle Devlog-0

Nov 06, 2022

Plan.

Plan is to make a bitmap font editor and later expand out.

I don't have a name for it. So, I am calling it Project-Bitle for now. I love naming things. I'll come up with a name even before a working prototype. Not sure what happened here. If you have any ideas for naming, you know what to do

The project is written in Python and uses Pyside for UI

The UI will be special and have pixel art styling (like aseprite)

The project is in its early early early stages

Features:

  • Export as bitmap font

  • Color palette

  • Live Preview

  • Glyph map

  • Pixel art UI

How it works on the inside.

I am using PySide itself for the image manipulation too [For now ig] cuz it's powerful enough

A quick summary of how drawing working in PySide.

There is a QPainter, consider it as the painter [as the name implies]

There are Paint Devices, which can be seen as the Canvas

[There is Qbrush and QPen, which decides how QPainter draw, consider them as the brushes and pens the painter has]

There is a "Surface" class, which handles the image data and manipulation. It is actually a combination of QPainter and a QImage (A Paint Device). So, it is self contained and doesn't need anything external to draw. It isn't widget [something we can see on the screen]. We need to use something to show this pixel data to the user

Canvas:

Widget that contains the surface. Displays the surface. Also handles clicks. This is a scene which contains the surface. Just like a scene in a game. Yes, it's a bit confusing.It's just how pyside works.

Viewport:

This is finally what if visible to the user. It's a widget on the screen

Toolhandler:

Handles the tool selection

Glyph palette:

A file contains all the character. It is read and an array is created. For each character, an element with the charcter name and a surface is added to the list

Ex:

(k, Surface),(l,Surface)

Each character has its surface. When you select a character, the related surface is called and drawn on

A model/ view system is used. Simply put, a model is the structure of how the data is stored (See example given above) and View is how the data is shown. Changes to the data will directly apply to the view.

View here is the grid that is seen at the bottom right

To-do:

  • Ability to draw on the surface

  • Color picker

  • Color palette

  • Tool settings

  • Preview

  • UI styling

You can find the project here:

https://github.com/Midhil457/Project-Bitle

:]

Enjoy this post?

Buy Leo Red a coffee

More from Leo Red