Note: This blog post was created with the assistance of AI to help explain Uniface concepts in simple terms.
📝 Introduction
Working with images in Uniface applications can be confusing at first. Uniface 10.4 offers several ways to display pictures in your applications, and each method has its own performance characteristics. In this guide, we'll explore the different approaches and help you choose the right one for your needs.
🎯 Four Ways to Reference Images
Uniface uses special symbols to tell the system where to find an image. Think of these symbols as shortcuts that point to different storage locations.
1. @ Symbol - Files from Disk 💾
The @ symbol loads images directly from your hard drive. This is the most straightforward method but also the slowest.
Example:
@C:\Images\logo.png
@company_banner.jpg
When to use it: Perfect for development and testing when you need to quickly swap images. Not recommended for production applications with frequent image loading.
Performance tip: Loading from disk involves input/output operations that can slow down your application. Use this method sparingly in production environments.
2. # Symbol - Database BLOBs 🗄️
The # symbol retrieves images stored as Binary Large Objects (BLOBs) in your database. This means the image data lives inside a database field.
Example:
#EMPLOYEE.PHOTO
#PRODUCT.IMAGE
When to use it: Ideal when your images need to be stored alongside other database records. User profile pictures and product images are common use cases.
Performance tip: Generally faster than loading from disk files, though this depends on your database management system (DBMS) configuration.
3. & Symbol - URLs for Web Applications 🌐
The & symbol works only in server pages and points to a web URL. This is the fastest method for web applications.
Example:
&https://example.com/images/header.png
&/static/logo.svg
When to use it: Always use this method for web applications when possible. The browser handles the image loading, and caching works automatically.
Performance tip: This is the champion of performance! Uniface doesn't process the image at all - the browser does all the work, and images can be cached for even faster loading.
4. ^ Symbol - Uniface Glyphs ⚡
The ^ symbol loads pre-compiled Uniface glyphs. These are special image formats optimized for desktop applications.
Example:
^ICON_SAVE
^BUTTON_OK
When to use it: Best for desktop applications where you need consistent, fast-loading icons and small images. Glyphs can be stored in UAR files or the Repository.
Performance tip: Very efficient for desktop apps because glyphs are compiled and optimized specifically for Uniface.
🔧 Working with Different Field Data Types
Uniface handles images differently depending on the field's data type. Here's what you need to know:
Image Data Type Fields 🎨
Fields declared as "Image" data type automatically handle all four reference types (@, #, &, ^). Uniface knows this field contains image data and loads it appropriately.
Example scenario: You have an EMPLOYEE entity with a PHOTO field of type Image. You can assign any of these values:
EMPLOYEE.PHOTO = "@photo.jpg"
EMPLOYEE.PHOTO = "#STORED_IMAGE"
EMPLOYEE.PHOTO = "^USER_ICON"
String Data Type Fields 📝
String fields can also display images if they contain the special notation (@, ^, or &). However, they cannot handle BLOB references (#). If your string doesn't use this notation, you'll need to define a ValRep list to tell Uniface how to interpret the data.
Other Data Types 🔢
For numeric or other data types, you must define a ValRep (Value Representation) list. This list tells Uniface how to convert the stored value into an image reference.
Example: A STATUS field containing numbers could use a ValRep list to display different icons:
- 1 = ^ICON_PENDING
- 2 = ^ICON_APPROVED
- 3 = ^ICON_REJECTED
📂 Image File Paths and Configuration
When you use the @ notation without specifying a full path, Uniface searches for the image in specific locations:
- The current working directory
- The directory specified in the "Images" assignment setting
Pro tip: Configure the Images assignment setting to point to a central image directory. This makes managing images much easier and allows you to use simple filenames like @logo.png instead of full paths like @C:\MyApp\Images\logo.png.
🚀 Performance Quick Reference
| Method | Speed | Best For |
|---|---|---|
| & URL | ⚡⚡⚡ Fastest | Web applications |
| ^ Glyph | ⚡⚡ Fast | Desktop applications |
| # BLOB | ⚡ Medium | Database-stored images |
| @ File | 🐌 Slowest | Development and testing |
💡 Practical Recommendations
- For web applications: Use URL references (&) whenever possible. Let the browser handle caching and loading.
- For desktop applications: Use glyphs (^) for icons and frequently-used images. They're optimized for performance.
- For user-uploaded content: Store images as BLOBs (#) in the database to keep everything together.
- For development: Disk files (@) are fine for testing, but consider switching to other methods for production.
🎓 Conclusion
Understanding image handling in Uniface 10.4 helps you build faster, more efficient applications. Choose the right method based on your application type and performance needs. Remember: URLs for web apps, glyphs for desktop apps, and BLOBs for database-stored content. With these tools in your arsenal, you're ready to handle any image requirement in your Uniface applications! 🎉
Have questions or tips about working with images in Uniface? Share them in the comments below!
Top comments (0)