Docs
BlupLearnSupportDownload
  • Home 🏠
  • Wiki
    • Design (UI) ✏️
      • Blup Top Bar
      • Blup Menu Bar
      • Pages/Layers Panel
      • Toolkit
      • Insert Panel
        • TextField Widget
        • Progress Widget
        • FAB Widget
        • Icon Widget
        • Lottie Animation Widget
        • Text Button Widget
        • Appbar Widget
        • Checkbox Widget
        • Switch Widget
        • Slider Widget
        • Radio Widget
        • Progress bar Widget
        • Multi choice dialog Widget
        • Web View Widget
        • Camera View Widget
        • Map View Widget
        • Date Picker Widget
        • Time Picker Widget
        • IOS Date Picker Widget
        • IOS Timer Widget
        • Alert Dialog box Widget
        • Dropdown Menu Widget
      • Properties Panel
        • Pages Properties
        • Text Properties
        • List Properties
        • Rectangle Properties
      • Page Canvas
      • Choose from Assets
      • Right-Click Menu in Design
      • How to use navigate page in Blup
    • Logics ⚡
      • UI Nodes
        • Rectangle UI Node
        • Text UI Node
        • Group UI Node
        • List UI Node
        • Page ListView UI Node
      • Helper Nodes
        • Boolean Nodes
        • Date Time Nodes
        • Double Nodes
        • Duration Nodes
        • Integers Nodes
        • Json Nodes
        • List Nodes
        • Map Nodes
        • String Nodes
      • Variables Node Section
      • Function Node Section
      • Maths Node Section
      • Flow Control Section
      • Relational Operators Section
      • Logical Operators Section
      • System Node Section
      • SDK Library Section
      • Blup Sheet API Node Section
    • Backend 🔗
      • Sheets
      • SQL
    • Blup Code Editor
      • File Explorer
      • Editor Area
    • Publish to stores 🚀(Ship)
      • iOS Cloud Build 😮‍💨
        • Configure ⚙️
        • Run ▶️
      • Play Store
    • Build Your First App
      • TODO App
  • Blup Settings
  • Import from Figma
  • How to use WebView in Blup
  • How to use Google Maps in Blup
  • How to use the camera in blup?
  • How to add Splash screen in Blup?
  • How to know Debug prints in blup
  • How to use Google sign in in Blup
  • Creating sign up/ sign in in Blup
Powered by GitBook
On this page
  • Toolkit
  • Selector Cursor
  • Rectangle Toggle
  • Text Toggle
  • EYE - Dynamic Content Visibility
  • Toolkit Tact - Flexible Palette Placement
  • Music to go with.

Was this helpful?

Edit on GitHub
  1. Wiki
  2. Design (UI) ✏️

Toolkit

Our versatile draggable toolkit is designed to elevate your experience by providing effortless access to tools like the selection cursor, rectangle, etc, enabling you to create with precision & ease.

PreviousPages/Layers PanelNextInsert Panel

Last updated 1 year ago

Was this helpful?

Toolkit

This segment encompasses all the necessary tools for constructing the UI. We'll delve into each tool individually, providing detailed explanations for features like the selection cursor, rectangle, text, and more.

Selector Cursor

The Selector Cursor within the Blup is your precision powerhouse.

With a click, the standard cursor transforms into a selector cursor, tailored for picking and modifying components seamlessly. Empowering you to apply diverse properties from the panel, optimizes your workflow.

Press 'V' or 'Escape' for a smooth transition back to the selector cursor.

Rectangle Toggle

The versatile Rectangle Toggle is utilized to generate rectangular shapes within the canvas or pages.

When hovering over the rectangle button, a GIF showcasing the various functionalities achievable with the rectangle toggle

Upon clicking the button and shifting the cursor to the pages section, it transforms into a cross cursor, facilitating the drawing of rectangular shapes on the screens akin to other designer tools on the market. The dimensions of the rectangle can be adjusted during its creation.

Additionally, the properties panel located to the right of the screen offers the option to modify various other properties of the selected rectangle.

Thanks to Blup's seamless integration with Windows/Mac OS, any images, GIFs, or videos present in your file explorer can be effortlessly dragged and dropped into any rectangle.

Text Toggle

Crucial for textual components, the Text Toggle feature within the Blup tool serves as your creative ally.

Hover over it for a demonstration, and Click to switch the cursor to a text cursor, enabling typing anywhere on the page.

Easily adjust the font size by switching back to the selector cursor and click-dragging the bottom of the text cell.

Delve into advanced customization options in the right-side panel.

Note: Text is used to show information to the user

EYE - Dynamic Content Visibility

The EYE tool in the Blup tool dynamically controls content visibility.

Toggle elements based on runtime criteria, enhancing adaptability and interactivity in your design. It's a key player in crafting responsive and user-centric interfaces.

Toolkit Tact - Flexible Palette Placement

Toolkit Tact is your tool for personalized workspace within the Blup tool.

Move the toolkit palette across the canvas as per your preferences and workflow needs. It offers flexibility for an adaptable and efficient design experience.

This toolkit ensures your UI designs are not just functional but visually compelling and user-friendly. Dive in and unleash your creativity within the Blup tool!

Music to go with.

If you have any ideas to make Blup better you can share them through our

Discord community channel
Lofi music
Toolkit
Selection Cursor
Rectangle Toogle
Text Toggle
Eye - Dynamic Content Visibility
toolkit tact