{"id":13526414,"url":"https://github.com/nekromoff/layouter","last_synced_at":"2025-04-12T08:23:37.327Z","repository":{"id":194629297,"uuid":"691217061","full_name":"nekromoff/layouter","owner":"nekromoff","description":"Simple grid layout library for LÖVE engine (Love2D).","archived":false,"fork":false,"pushed_at":"2024-04-22T12:39:54.000Z","size":13,"stargazers_count":16,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-26T03:33:12.498Z","etag":null,"topics":["buttons","design","interface","layout","love2d","love2d-framework","love2d-game","lua","menu","ui"],"latest_commit_sha":null,"homepage":"","language":"Lua","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"lgpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/nekromoff.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2023-09-13T18:19:23.000Z","updated_at":"2025-02-03T20:51:19.000Z","dependencies_parsed_at":"2024-04-22T14:06:41.488Z","dependency_job_id":null,"html_url":"https://github.com/nekromoff/layouter","commit_stats":null,"previous_names":["nekromoff/layouter"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nekromoff%2Flayouter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nekromoff%2Flayouter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nekromoff%2Flayouter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nekromoff%2Flayouter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nekromoff","download_url":"https://codeload.github.com/nekromoff/layouter/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248538043,"owners_count":21120934,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["buttons","design","interface","layout","love2d","love2d-framework","love2d-game","lua","menu","ui"],"created_at":"2024-08-01T06:01:29.337Z","updated_at":"2025-04-12T08:23:37.285Z","avatar_url":"https://github.com/nekromoff.png","language":"Lua","readme":"# Layouter\n\nLayouter is a simple **UI grid layout library** for LÖVE 2D game engine.\n\nIt currently supports these element types:\n\n- text (including spacer = blank text)\n- text button\n- image\n\n## Screenshots\n![image](https://github.com/nekromoff/layouter/assets/8550349/4f31272d-c69b-4bba-a109-d14f823fb5c8)\n\n## Usage\n\n### 1. Include layouter\n```\nlayouter = require 'layouter'\n```\n\n### 2. Initialize layouter\nDefaults=15px, white background, black color, debug disabled:\n```\nlayouter.initialize()\n```\nor with a custom look (font=20px, background=black, color=white, debug mode enabled=draw grid):\n```\nlayouter.initialize({font=love.graphics.newFont(20), background={0,0,0}, color={255,255,255}, debug=true})\n```\n\n### 3. Add elements to your layout\n#### Text element\n```\nlayouter.add('Hello world!')\n```\n#### Text element with options\n```\nlayouter.add({content = 'Second text paragraph', font = love.graphics.newFont(50), color = {13, 46, 63}})\n```\n#### Spacer (blank paragraph)\n```\nlayouter.add()\n```\n#### Image with required custom key (key can be used to replace or remove it later)\n```\nlayouter.add({content = love.graphics.newImage('logo.png'), type = 'image', key = 'logo'})\n```\n#### Button\n```\nlayouter.add({content = 'Start game', type = 'button', callback = function() startGame() end})\n```\n#### Button that replaces itself on a click with a text\nNote the automatically assigned key `eastereggs` that is created from the text.\n```\nlayouter.add({content = '* easter! Eggs $@', type = 'button', callback = function() layouter.replace('eastereggs', 'Currently does nothing.') end})\n```\n\n### 4. Prepare your layout\nSet where to draw your elements, how they should be aligned horizontaly or vertically and if auto spacing (based on number of elements) should be done.\nx=position X, y=position Y, direction=`horizontal` or `vertical`, spacing=`auto` for automatical centering, optionally also padding=(in pixels)\n```\nlayouter.prepare({x = layouter.COLUMN6, y = layouter.ROW4, direction = 'vertical', spacing = 'auto'})\n```\n\n### 5.Draw your layout\n```\nfunction love.draw()\n    layouter.draw()\nend\n```\n\n### 6. Process mouse clicks for buttons\nThis functions needs to be called to enable interaction for buttons.\n```\nfunction love.mousepressed(x, y, mouse_button, is_touch)\n    layouter.processMouse(x, y, mouse_button, is_touch)\nend\n```\n\n### Grid positioning - columns and rows\nThe grid comes with 24 columns and 16 rows.\nLayouter automatically calculates sizes of columns and rows and generates helper variables.\nYou can use these helper variables to position your elements and layout easily:\n```\n-- columns:\nlayouter.COLUMN1 -- first column's right side, i.e. will position element right after first column\n-- ...\nlayouter.COLUMN8 -- X position after width of eight columns\n\n--- rows:\nlayouter.ROW1 -- Y position after height of a first row\n-- ...\nlayouter.ROW4 -- Y position after height of four rows\n```\n","funding_links":[],"categories":["UI"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnekromoff%2Flayouter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnekromoff%2Flayouter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnekromoff%2Flayouter/lists"}