• Become a Power user Intro to AutoHotkey Intermediate AutoHotkey Intermediate Objects GUIs are Easy w/AutoHotkey Painlessly switch from V1 to V2

Create beautiful htmlGUIs with Maestrith’s class

Get Maestrith’s htmlGUI class here

Here are two videos to learn how to use Maestrith’s awesome HTML GUI class in AutoHotkey v1

Maestrith showing htmlGUI to Isaias and Joe
Maestrith showing htmlGUI to Isaias and Joe

The video demonstrates various coding techniques for creating dynamic GUIs with HTML, including tips on using CSS and JavaScript, while also discussing recent tech news and updates.

  • 00:00 ‍ Maestrius shows how to create dynamic GUIs with HTML, while Windows 11 adopts Linux-like features and people abandon carriage returns.
    • Maestrius gives a walkthrough of his powerful HTML GUI class, demonstrating how to easily create customized GUIs with dynamic buttons and images.
    • Windows 11 is similar to Linux and everyone is dropping the carriage return.
    • The speaker demonstrates how to create a named window and change its style using different color options.
    • The lecture covers the handling of GUI options such as resize, tool window, and owner, with an example of setting the x and y position to 500 by 300.
  • 05:10 ‍ The speaker demonstrated various coding techniques, including creating buttons, displaying elements with DOM, creating columns and objects, and creating an edit box with color change feature.
    • The speaker creates a button with attributes and HTML, adds a reset function, and successfully clicks on the button without errors.
    • The speaker created a function to display a message box and a list view element using the DOM function.
    • Create columns with id and name, then create an object with id and things and specify column types.
    • The lecture demonstrated how to create an edit box that keeps track of the original value and changes color when modified, with the option to turn off the color change feature.
  • 11:50 The speaker explains how to use an attribute in AutoHotkey to create a better GUI, and discusses the differences in accessing text content between DOM and AutoHotkey.
    • To add an input element with an ID and style, use the create element method and specify the attributes.
    • Add “ignore state” to the search function.
    • The speaker discusses an attribute in AutoHotkey and demonstrates how to use it to create a more visually appealing GUI.
    • You can pull directly from the HTML using standard selectors to get the value directly, but in AutoHotkey, you can only use the value property.
    • There are two ways to access text content, one with new lines and one without, and while accessing the value only is the DOM way, AutoHotkey handles it differently but still gets everything.
  • 19:46 ‍ The speaker shares tips on creating tap stops, adding images to webpages, and adjusting text areas and inputs in CSS.
    • The speaker expresses their dislike for Zoom and shares their experience of dropping files onto a button in their code.
    • There are different ways to access text in a control, but in AutoHotkey, you can only access the value.
    • The speaker demonstrates how to create tap stops and drop images using gg create elements and img attributes.
    • The speaker demonstrates how to add an image to a webpage by reading the file and changing the source tag of the original image.
    • Using an HTML GUI for hotkeys is easier to deal with than specific windows because it allows for more flexibility and control over DPI settings.
    • The speaker adjusts the width and height of text areas and inputs in CSS to fit the desired dimensions.
  • 32:23 ‍ The speaker shared tips on CSS ID selection, HTML element creation, pop-up windows, and table alignment.
    • The speaker struggled with selecting the correct ID in CSS, but eventually figured it out and was able to adjust the size of the input.
    • HTML can be programmed using the create element function to create buttons with inputs and other crazy stuff.
    • The speaker explains how their fancy window works and how everything gets routed through the escape button, allowing for the creation of multiple pop-ups.
    • Creating and aligning tables in HTML is easy, but in hockey it is not as straightforward due to the lack of a grid-based system.
  • 41:02 The speaker shared tips on using JavaScript to append HTML, manage favorites with SQLite, and show/hide information with divs.
    • The speaker fixed a background color issue by creating a method to inherit all background and foreground colors and allowing for custom color changes.
    • The lecture discussed appending HTML and resetting buttons in JavaScript.
    • The speaker discusses the flexibility and ease of using an HTML tied to an SQLite browser or file for managing favorites and issuing raw SQL queries.
    • The speaker discusses using divs to show and hide information, updating columns in tables, and sharing a GitHub link that hasn’t been updated in six months.
  • 48:51 Use HTML’s flexible resizing options to create responsive designs that adapt to different screen sizes.
    • The browser might not be on Windows anymore, but the com object is not going to disappear.
    • The speaker suggests using a powerful tool and playing around with it, acknowledging that it may require some tweaking and a lot of code, but ultimately saves time in the long run.
    • HTML allows for flexible resizing using percentages instead of fixed sizes, including an em system that is relative to screen size.
  • 52:42 SpaceX successfully launched and landed its Falcon 9 rocket carrying 60 Starlink satellites into orbit.
    • Leave comments and ask questions on the video as the speaker reads and appreciates every comment.

 


Creating Beautiful GUIs with AutoHotkey / HTML GUIs are amazing!

Creating Beautiful GUIs with AutoHotkey / HTML GUIs are amazing!

The video demonstrates how to create visually appealing GUIs using AutoHotkey and HTML, providing templates and guidance for customization.

  • 00:00 The speaker showcases impressive GUI creation skills using AutoHotkey and HTML, offering assistance and templates for viewers to create their own visually appealing GUIs.
    • The speaker discusses a new HTML GUI class in AutoHotkey that allows for creating impressive and interactive GUIs with knowledge of HTML and CSS.
    • The video showcases the speaker’s impressive skills in creating GUIs with AutoHotkey and HTML, and viewers are encouraged to ask questions and seek templates for assistance in understanding and creating their own GUIs.
    • The video demonstrates how to create visually appealing GUIs using AutoHotkey.
  • 03:23 You can customize GUIs in AutoHotkey and HTML by retrieving specific values, customizing colors and sizes, ignoring state changes, applying CSS styles, and positioning elements using divs.
    • You can retrieve specific values from an object by calling them directly, and customize the colors and size of input elements in the GUI.
    • The speaker explains how to customize GUIs using AutoHotkey and HTML, including ignoring state changes, applying CSS styles, and positioning elements using divs.
  • 06:47 Create beautiful GUIs with AutoHotkey by specifying position and adding images or text, triggering actions through button clicks and text input, and utilizing features like custom cursors and file dropping.
    • Create a GUI with AutoHotkey by specifying the position and adding an image or text, using the “create element” function and specifying the source and size of the image.
    • Clicking on buttons and typing in a text field can trigger actions such as displaying tooltips or performing actions on a picture.
    • The speaker demonstrates how to create a GUI with AutoHotkey and HTML, showcasing features such as custom cursors and file dropping.
  • 15:18 Files can be dropped onto different controls in the GUI, allowing for specific actions based on where they are dropped, and having templates for GUI elements would be helpful for beginners.
    • Files can be dropped onto different controls in the GUI, with each control having its own drop target, allowing for specific actions to be performed based on where the files are dropped.
    • Having templates for different GUI elements would be helpful for people who are not familiar with creating GUIs.
  • 20:02 The speaker shows how to create a GUI with AutoHotkey, including populating a media grid and resizing images within it, as well as adding a drop target for images.
    • The speaker demonstrates how to create a GUI with AutoHotkey by populating a media grid and adjusting the size of images within the grid.
    • The speaker discusses resizing images and adding a drop target for images in a GUI.
  • 24:10 The speaker shows how to create visually unique GUIs with AutoHotkey and HTML, enabling image dragging and dropping to create custom bouquets.
    • The speaker demonstrates how to create visually different GUIs using AutoHotkey and HTML, allowing for the dragging and dropping of images to create a different bouquet.
    • The speaker mentions that they need to figure something out, which is a little dated and they haven’t seen it yet, but someone told them about it.
  • 27:02 AutoHotkey allows users to create attractive GUIs easily with HTML and CSS, but understanding the structure and components is important, and example templates would make the process even more straightforward.
    • AutoHotkey allows users to create attractive GUIs easily by utilizing HTML and CSS, although understanding the structure and components is necessary, and providing example templates would make the process even more straightforward.
    • The speaker explains that they received a video explaining the changes in the GUI and how they were able to create GUIs with autohotkey, finding it fascinating and showing that everything resizes properly.
  • 29:00 Use the shift key to select multiple keys in a row, but be aware that selecting downwards will deselect the bottom keys.

 

Comments are closed.