Build reusable page components and use them across your application.
Recorded with an earlier Twidget interface. Names, control locations and available options may differ; use the linked documentation for current guidance.
Watch tutorial (3:02)Page components are reusable building blocks within the Twidget platform that enhance development efficiency by allowing users to create, manage, and implement consistent UI elements across multiple pages. They serve to encapsulate functionality and design into a single entity, which can be reused and modified independently from other components.
Reusability: By creating a page component, users can utilize the same visual and functional elements in different contexts without the need to recreate them every time. This reduces redundancy and aids in maintaining a cohesive design language throughout the application.
Component Modification: Changes made to a page component will reflect anywhere the component is used across the platform, streamlining updates and ensuring consistency.
Dynamic Variables: Users can define variables within page components that allow for dynamic content modification. This enables flexibility in how components interact with various data inputs, tailoring the user experience.
Component Creation: Users can create a new page component by defining its name, description, and type. This process includes selecting elements like images and text to comprise the component's UI.
Integration into Pages: Once created, page components can be added to other pages by accessing a sidebar that lists all available components, allowing for quick assembly of page layouts.
Automatic Updates: Any modification made to a page component requires the component to be published for changes to propagate across all instances where it is used. This ensures that all pages using the component benefit from any bugs fixes or design updates, maintaining uniformity.
Variable Management: Users can incorporate variables into page components, enabling dynamic behavior. When a component is placed on a page, the values of these variables can be customized, allowing for tailored interactions while preserving the component's base structure and functionality.
Page components in Twidget simplify the process of designing and managing application interfaces by offering a modular approach to UI element creation. Their reusable nature, combined with the ability to incorporate dynamic variables, empowers developers to streamline their workflow and enhance the maintainability of their applications.
Layout Controls
Layout controls are essential components in Twidget, allowing developers to manage the visibility and behavior of various layout elements, such as modals and drawers, within a user interface. These controls enable dynamic user interactions by facilitating the opening, closing, and toggling of layout...
Page tables
Use a Table element to show a list of records with search, sortable headings and paging. Choose an existing Table page creation option, add a Table element in the editor, or start with a [Page starter](/docs/pages/page-starters). Find the right element. Select the table on the canvas or in Layers. T...
Page starters
Page starters give you a useful first layout for a records tool, customer view or operational dashboard. Start with clearly labeled demonstration data, customize the page, then connect the endpoints your customers are allowed to use. Choose a starting point. Open Pages, choose Create Page, then Page...
Custom Page Functions
Reusable custom page functions in Twidget enhance the development experience by allowing users to define and manage functions that operate specifically within the context of pages and page components. This capability is an integral feature for creating dynamic, interactive web applications without t...
Element Actions
Element actions in Twidget are integral commands that can be assigned to user interface elements, enabling interactivity within applications. The actions are defined to respond to user inputs, primarily through triggering events associated with specific elements. Purpose of Element Actions. Element ...
