原文地址: https://toshareapex.hashnode.dev/modernizando-aplicaciones-con-content-row-en-oracle-apex # 使用 Content Row 在 Oracle APEX 中实现应用现代化 ![💡Modernizando Aplicaciones con Content Row en Oracle APEX💡](https://toshareapex.hashnode.dev/_next/image?url=https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1768237389945%2Fc01e818a-ff61-4b28-9e2f-14a2ce8edafa.jpeg&w=3840&q=75) ## 简介 Oracle APEX 近年来取得了巨大的发展,不仅体现在性能和安全性上,还包括向最终用户呈现信息的方式。如今,仅仅在传统的表格报表中显示数据已经不够,用户期望的是**现代化、动态化且面向操作**的体验。 **Content Row** 就是一种新型的区域,它彻底改变了 APEX 应用中数据的展示和消费方式。本文将探讨什么是 Content Row、为什么它对现代化应用至关重要,以及它如何提供更加流畅、以用户为中心的视图。 ## 什么是 Content Row? **Content Row** 是 Oracle APEX 设计的一种区域类型,用于以**视觉化、灵活和高度可定制**的格式显示信息,灵感来自现代网页和移动应用的设计模式。 与经典报表(如 Interactive Report 或 Interactive Grid)不同,Content Row 不仅仅是为了列出数据行,而是为了**为每条记录讲述一个故事**,结合以下内容: - 标题和副标题 - 图标或头像 - 状态徽章 - 富文本描述 - 上下文操作 每一行都成为一个**独立的信息块**,易于理解并提供明确的操作。 ## 示例演示 以下是演示结果的 GIF 以及逐步实现方法: ![演示](https://cdn.hashnode.com/res/hashnode/image/upload/v1768235104922/69ba4879-6470-43f9-a049-2b1686d1885b.gif) 1. 创建一个类型为 CONTENT ROW 的区域,并输入需要显示信息的 SQL 查询。 ![创建区域](https://cdn.hashnode.com/res/hashnode/image/upload/v1768235251826/519aa1eb-b407-4c3e-a026-d7f9fbc0cfb4.png) 2. 在属性中,指定查询中每个字段在 Content Row 中的显示位置。 ![指定字段位置](https://cdn.hashnode.com/res/hashnode/image/upload/v1768235525437/38efe685-9607-4a9a-b46f-9f175ef21d5e.png) 如果要显示项目状态的徽章(Badge),启用选项并分配值和状态: ```sql //State Select the source column for the state of the badge. Substitute column value with "danger", "warning", "success" or "info" for default styling.// ``` ![显示徽章](https://cdn.hashnode.com/res/hashnode/image/upload/v1768235727867/16db84b4-a153-464c-93f0-58fdda30be5e.png) 3. 创建操作(Actions)。可以为每一行创建不同类型操作,例如 Primary、Avatar Link、Title、Full Row Link 或 Badge Link。此案例中使用 Primary Actions 位置。 ![创建操作](https://cdn.hashnode.com/res/hashnode/image/upload/v1768236031880/97c7e711-4029-4205-8ee0-96282775e9d1.png) - Action: View Projects → 这里我们创建了一个 MENU 类型操作,并重定向到另一页面。 ![View Projects](https://cdn.hashnode.com/res/hashnode/image/upload/v1768236222860/957774dc-5974-40c0-bd85-093e062a444f.png) - Action: Eliminar Project → 这里执行 DELETE 操作,根据所选 ID 或行调用 AJAX CALLBACK 进程删除记录,然后刷新区域。 类型: Menu Entry 链接: Redirect to URL → javascript:eliminar(&ID.) ```sql function eliminar(projectId) { apex.server.process("ELIMINAR_PROJECT", { x01: projectId }, { dataType: "text", success: function(pData) { apex.region("projects").refresh(); }, error: function(req, a, c) { console.error("ERROR AJAX", req.responseText); } }); } ``` 接着创建 AJAX CALLBACK 函数:ELIMINAR_PROJECT。 ![AJAX CALLBACK](https://cdn.hashnode.com/res/hashnode/image/upload/v1768236642908/0c6c92f7-7771-4f5e-97ab-70f66a5e0941.png) ## 结论 Content Row 不仅仅是 Oracle APEX 中的一个新区域类型,它更是一种**全新的思维方式**——不再将数据呈现为静态表格,而是设计以用户为中心的体验。 采用 Content Row 后,APEX 开发者可以提供以下优势的应用: - 更加视觉化 - 更加动态化 - 更加直观 - 更加面向操作 总之,对于那些希望**现代化其 APEX 应用**并符合当前用户期望的开发者来说,Content Row 是一个关键功能。 _准备好将你的报表转变为体验了吗?_