26 مستودعات
Systems for organizing UI elements into grids, columns, and pages.
Distinguishing note: Focuses on user-defined dashboard layout structures rather than general CSS layout engines.
Explore 26 awesome GitHub repositories matching user interface & experience · Layout Managers. Refine with filters or upvote what's useful.
Glance is a self-hosted web portal designed to aggregate real-time data, system monitoring, and content feeds into a single, customizable dashboard. It functions as a centralized interface for managing internal tools and network services, allowing users to secure their portal with password authentication and define the application's visual identity and layout through structured configuration files. The platform is built on a modular widget engine that treats individual dashboard components as isolated units. This architecture enables users to arrange widgets into custom pages and columns, wit
Enables users to structure interfaces by arranging widgets into pages and columns.
Frigate is a self-hosted network video recorder that functions as a private, local AI-powered vision engine. It manages video streams by performing real-time object detection, tracking, and classification directly on local hardware, ensuring that security monitoring and activity recording remain independent of cloud services. The system distinguishes itself through a modular, hardware-accelerated video pipeline that offloads intensive decoding and machine learning inference to dedicated GPUs, NPUs, or specialized accelerators like Coral TPUs and Hailo modules. It utilizes state-based object t
Optimizes the visual arrangement of multiple camera feeds through resolution and aspect ratio adjustments.
Dash is a Python-based framework for building analytical web applications and reactive data dashboards. It allows developers to connect data science and machine learning code to interactive web interfaces without writing JavaScript, serving as a backend-driven tool for defining layouts and managing state. The framework integrates the Plotly charting engine to render a wide variety of complex charts and financial graphs. It distinguishes itself through a reactive callback system that links user input components to data visualizations, enabling the creation of business intelligence dashboards a
Defines the initial hierarchy of UI components as a JSON structure to render upon page load.
Draggable is a JavaScript library for implementing draggable elements and sortable lists within a web browser. It provides a functional toolset for creating accessible drag and drop interfaces and a mechanism for dynamically swapping, sorting, and reordering HTML elements in real time. The library features a cross-input interaction layer that unifies mouse, touch, and force-touch events into a single stream for consistent behavior across different devices. It specifically includes tools for providing screen reader feedback and assistive technology support to ensure drag operations are accessi
Defines specific droppable zones and restricts element movement to maintain a structured page layout.
tview is a library for building interactive text-based user interfaces in Go. It functions as a toolkit for managing event loops, user input, and screen rendering, providing a framework of pre-built widgets and an integrated layout engine for creating command-line applications. The project distinguishes itself through a comprehensive layout system that uses grid and flexbox models to create responsive designs. It also supports UI layer stacking to manage multiple screens and modal overlays. The framework includes a diverse suite of interactive components for data display, such as tables and
Integrates multiple layout strategies, including grids and flexboxes, to organize interface components.
AsyncDisplayKit is an asynchronous UI framework and performance library for iOS. It provides a collection of performant alternatives to standard views, allowing developers to build responsive interfaces by offloading layout and rendering tasks to background threads. The framework is centered around a declarative layout engine based on a flexbox model, which calculates element positions and sizes asynchronously. It utilizes a node-based abstraction to wrap native views, enabling the instantiation and configuration of UI hierarchies on background threads to prevent main thread blocking. The sy
Arranges elements in horizontal or vertical stacks with configurable spacing and flexible growth behaviors.
shadcn-vue is an accessible design system framework and UI component library for Vue applications. It provides a collection of accessible, unstyled interface elements and pre-designed building blocks styled with Tailwind CSS, all of which are built on top of Radix Vue primitives. The project utilizes a command line interface to install specific components and themes directly into a local project directory rather than as pre-compiled dependencies. This distribution model allows users to own and modify the source code locally to create a custom design language. The library covers a broad range
Offers structural components like sidebars, accordions, and tabs to organize UI elements and page content.
Walk is a comprehensive framework for building native Windows desktop applications. It functions as a GUI library and Windows API wrapper, providing a toolkit of native widgets and a declarative layout system for developing high-performance user interfaces. The project is distinguished by its data-binding framework, which uses reflection and string-based property paths to synchronize data sources with interface widgets. It also provides specialized support for high-DPI interface scaling and an optimized native message loop to reduce runtime overhead. The toolkit covers a wide range of capabi
Implements a linear layout system for organizing interface elements in horizontal or vertical rows with managed stretching.
هذا المستودع عبارة عن مجموعة من التطبيقات والمعارض المرجعية التي توضح أفضل الممارسات لنظام Android View. يوفر مجموعة من الأمثلة العملية لبناء واجهات المستخدم، بما في ذلك معرض المكونات وأدلة التنفيذ للتخطيطات، وأداء القائمة، وتصميم الحركة. يتميز المشروع بعينات مفصلة لتنسيق رسوم متحركة التخطيط وتأثيرات الانتقال. يتضمن عروضاً توضيحية متخصصة لرسوم متحركة معقدة للحركة باستخدام الإطارات الرئيسية والاستيفاء، بالإضافة إلى أداة تصور لمنحنيات استيفاء الرسوم المتحركة لتحديد معلمات الحركة. يغطي الكود المصدري مجالات قدرات واسعة بما في ذلك إدارة القائمة عالية الأداء مع إعادة تدوير العرض والتحديثات التفاضلية، والتنقل المرقم مع مزامنة علامات التبويب، وقابلية تكيف الواجهة لأوضاع النوافذ المتعددة والشاشة المقسمة. كما يتضمن عينات لتخطيطات البطاقات، ومحتوى الويب المضمن، واختبار واجهة المستخدم الآلي لانتقالات الصفحة.
Arranges elements in either linear or grid formats to control item positioning on the screen.
This C++ data visualization library is a scientific plotting framework used to create 2D and 3D charts, network graphs, and geographic maps. It operates as a multi-backend graphics library, decoupling high-level plotting logic from low-level rendering engines to support various output backends. The project distinguishes itself with a dual-interface API, providing both a global functional interface for rapid prototyping and an object-oriented interface for precise control. It features a component-based layout engine for managing tiled grids and subplots, alongside a layered plot state that all
Allows the definition of multiple independent coordinate systems within one figure to view datasets side-by-side.
Cursive هي مجموعة أدوات واجهة مستخدم طرفية عبر المنصات وإطار عمل لبناء تطبيقات تفاعلية بلغة Rust. توفر نظاماً نمطياً لإنشاء واجهات رسومية قائمة على النصوص، باستخدام محرك مخصص لإدارة حلقة العرض الرئيسية وتسلسلات العرض الهرمية. تتميز مجموعة الأدوات بطبقة تجريد محايدة للخلفية لضمان رندرة متسقة ومعالجة المدخلات عبر أنظمة تشغيل مختلفة. وتتميز بمحرك سمات قائم على اللوحة يدعم تحميل السمات في وقت التشغيل ورندرة الألوان الحقيقية، بالإضافة إلى القدرة على إنشاء تسلسلات هرمية لواجهة المستخدم مباشرة من ملفات التهيئة. يغطي إطار العمل مجموعة واسعة من القدرات بما في ذلك إدارة التخطيط المعقدة مع لوحات مقسمة وعلامات تبويب، ومجموعة متنوعة من المكونات التفاعلية مثل مربعات الحوار المشروطة، ومؤشرات التقدم، والقوائم القابلة للتحديد. ويدعم رندرة المحتوى الغني للصور وتمييز الصيغة، ويستخدم نظام توجيه أحداث دورة التركيز لإدارة التنقل عبر لوحة المفاتيح والاستدعاءات العالمية. تتم إدارة الحالة من خلال تحديثات واجهة المستخدم غير المتزامنة والوصول القائم على المعرف، مما يسمح للمطورين بتعديل طرق عرض محددة ديناميكياً من المهام الخلفية.
Organizes interface elements in single horizontal or vertical rows with relative stretching.
North هي منهجية تصميم ويب متجاوبة وإطار عمل معمارية CSS يعتمد على Sass. توفر نظاماً لبناء واجهات مستخدم تعتمد على الجوال أولاً باستخدام شبكات مرنة وتقنيات التحسين التدريجي لضمان تجربة متسقة عبر قدرات المتصفح وأحجام الشاشات المختلفة. يتميز المشروع بنظام تسمية CSS قياسي يستخدم Sass mixins لتوليد أسماء الفئات برمجياً، مع التمييز بين المكونات، والتخطيطات، والحالات. كما يعمل كأداة لهيكلة مشاريع الواجهة الأمامية، حيث يوفر مولداً لتهيئة بيئات جديدة باستخدام أوراق أنماط ومشغلات مهام مهيأة مسبقاً. بعيداً عن التنسيق، يغطي إطار العمل مساحة واسعة من معايير تطوير الويب، بما في ذلك تنفيذ HTML الدلالي مع بيانات RDFa الوصفية وتدقيق إمكانية الوصول للويب. يدمج استراتيجية تصميم تركز على المحتوى وسير عمل مرن للواجهة الأمامية لتنسيق الانتقال من هندسة المعلومات وشخصيات المستخدم إلى مكونات جاهزة للإنتاج. يتضمن النظام أدوات لأتمتة تسمية CSS وهيكلة قوالب المشاريع لتسريع الإعداد الأولي.
Implements asymmetric, custom grid layouts derived from specific content requirements rather than generic symmetric systems.
هذا المشروع عبارة عن منهج تعليمي متقدم لـ CSS يتكون من ملفات أولية ومشاريع نهائية. يوفر مجموعة من التنفيذات الواقعية ومعرض مشاريع مصمم لإتقان تقنيات التخطيط والتصميم الحديثة. يركز المنهج على نهج نمطي لأوراق الأنماط باستخدام متغيرات Sass والمعمارية. يؤكد على اتفاقية تسمية المعدل-العنصر-الكتلة (BEM) لإنشاء CSS قابل للصيانة وإعادة الاستخدام. تغطي المادة عدة مجالات قدرات أساسية، بما في ذلك تصميم الويب المتجاوب باستخدام CSS Grid، وFlexbox، واستعلامات الوسائط. كما تتضمن تطوير تأثيرات الحركة من خلال إطارات CSS الرئيسية والانتقالات، بالإضافة إلى دمج رسومات المتجهات القابلة للتوسع والصور المحسنة لتصميم الواجهة الأمامية.
Employs two-dimensional grid coordinates to define complex structural page layouts.
CollectionKit هو إطار عمل لبناء شبكات وقوائم قابلة للتمرير عالية الأداء على منصات Apple. يوفر محركات لمزامنة الحالة التصريحية، وعرض الشبكة الديناميكي، وتكوين البيانات متعدد الأقسام داخل طرق عرض المجموعة. يتميز إطار العمل بمزامن تصريحي يحسب اختلافات البيانات لتحديث عناصر الواجهة دون إعادة تحميل العرض بالكامل. يتضمن محرك تخطيط شبكة ديناميكي لعرض البيانات في أنماط تدفق أو شلال، ومؤلف بيانات يجمع مصادر بيانات مختلفة في عرض واحد مع مزودي أقسام مستقلين. يدعم النظام استيفاء مواضع العناصر وخصائصها لإنشاء رسوم متحركة أثناء تغييرات التخطيط والإضافات والحذف. يدير تنظيم البيانات في تدفقات مرئية منظمة من خلال تكوينات تخطيط الخلايا والعرض المحسن للتمرير.
Organizes data into high-performance scrollable lists and grids with custom spacing for Apple platforms.
This project is a reference guide and technical resource for building user interfaces with the SwiftUI framework. It provides a comprehensive collection of code examples, documentation, and a component library of reusable view implementations and layout patterns. The resource includes a compatibility map that links modern declarative views to their equivalent imperative counterparts in the UIKit framework. This documentation assists with the migration from UIKit to SwiftUI by providing guidance on wrapping legacy view controllers and view subclasses within a declarative hierarchy. The guide
Implements flexible vertical and horizontal grids with custom alignment and spacing.
MyLinearLayout هو إطار عمل لتخطيط واجهة المستخدم بلغة Objective-C ومحرك تخطيط متجاوب لنظام iOS. يعمل كمنسق عرض متعدد الأنماط ينظم عناصر الواجهة باستخدام مزيج من أنماط التخطيط الخطي، والنسبي، والشبكي. تجلب المكتبة سلوك CSS flexbox والعناصر العائمة إلى طرق عرض iOS لتوزيع المساحة الديناميكي. وتتضمن نظاماً مخصصاً لاتجاهات اللغات من اليمين إلى اليسار، مما يوفر انعكاساً تلقائياً لعناصر الواجهة لدعم التخطيطات المترجمة. يغطي إطار العمل مجموعة واسعة من استراتيجيات الترتيب، بما في ذلك التفاف العناصر القائم على التدفق، وتكديس طرق العرض القائم على الإطار، والتنظيم في جداول وشبكات. كما يدعم الترتيبات العضوية عبر محاذاة طرق العرض القائمة على المسار ويوفر فئات حجم تكيفية لتناسب أحجام واتجاهات شاشات الأجهزة المختلفة.
Positions views in a single horizontal or vertical row or column to create linear structures.
هذا المشروع عبارة عن مجموعة من التنفيذات المرجعية ونماذج الأكواد لبناء واجهات مستخدم عبر المنصات باستخدام إطار عمل Xamarin.Forms. يوفر أمثلة عملية لتطوير تطبيقات الهاتف المحمول وسطح المكتب من قاعدة كود واحدة تستهدف أنظمة تشغيل متعددة. يركز المستودع على الأنماط المعمارية واستراتيجيات التكامل، وتحديداً توضيح استخدام MVVM لمزامنة البيانات بين النماذج وطبقات العرض. يتضمن أمثلة لتكامل المنصات الأصلية، مثل استدعاء واجهات برمجة التطبيقات الخاصة بالمنصة وإنشاء عارضين مخصصين لتجاوز عناصر التحكم المشتركة الافتراضية. تغطي الأمثلة نطاقاً واسعاً من القدرات، بما في ذلك استخدام XAML لتخطيطات واجهة المستخدم التعريفية وتكامل خدمات الويب REST و SOAP. تشمل المجالات المميزة الأخرى الاحتفاظ بالبيانات محلياً باستخدام SQLite، ومصادقة الهوية السحابية، وتنفيذ مخططات تنقل متنوعة مثل واجهات التبويب وقوائم التنقل الجانبية. يوفر المشروع أيضاً أمثلة لخطوط أنابيب البناء المؤتمتة لمنصات متعددة واختبار واجهة المستخدم عبر المنصات.
Provides examples of using grid layouts to organize interface elements into rows and columns.
ioscreator is a comprehensive set of educational resources and reference guides for building mobile applications on the iOS platform. It provides a structured course and tutorial series focused on combining interface design with mobile logic using the SwiftUI framework. The project distinguishes itself through specialized guides for hardware integration and state management, covering the use of device sensors such as the camera, microphone, and accelerometer. It also includes a dedicated UI component library and tutorials for implementing native Apple system services. The materials cover a b
Implements lazy-loading grids that generate elements only when they enter the viewport to optimize performance.
django-grappelli is a visual and functional framework for the administration interface, providing a grid-based theme, UI kit, and a customizable landing page dashboard. It replaces the default administration interface with a structured layout designed to organize model forms and changelists. The project distinguishes itself through specific interface enhancements, such as autocomplete lookups for relational fields, rich text editor integration, and the ability to drag-and-drop reorder inline model rows. It also includes a context-switching mechanism that allows administrators to impersonate o
Applies a two-dimensional grid layout to the administration interface to improve visual organization.
أداة toolong هي عارض سجلات طرفي ومدير سجلات TUI مصمم لمراقبة تدفقات السجلات الحية والتنقل في ملفات السجلات الكبيرة. تعمل كمجمع للسجلات ومنسق JSONL، قادرة على دمج ملفات سجلات متعددة في عرض زمني واحد من خلال الكشف التلقائي عن الطوابع الزمنية. يدعم التطبيق تصور البيانات المهيكلة من خلال تنسيق ملفات JSONL بشكل جميل وتطبيق تمييز الصيغ البرمجية على أنماط سجلات خوادم الويب الشائعة. يتعامل التطبيق مع البيانات واسعة النطاق بكفاءة من خلال طرق عرض قابلة للتمرير ذات حجم افتراضي، مما يسمح للمستخدمين بفتح السجلات المضغوطة أو الملفات بأي حجم دون تحميل المستند بالكامل في الذاكرة. يتضمن النظام قدرات لتتبع تدفقات السجلات (Tailing)، وإجراء مطابقة نصية تقريبية (Fuzzy matching)، وإدارة التنقل عبر نموذج شاشة قائم على المكدس. كما يوفر لوحة أوامر لاكتشاف وظائف التطبيق ويدعم عناصر تفاعلية مثل الروابط القابلة للنقر وتلميحات الأدوات عند التحويم.
Organizes components into rows and columns where elements can span multiple cells.