FMX Archives | Dimensional Data

FMX

May 13, 2023

How To Change The Background Color Of A Memo In An FMX C++ App

C++ Builder

C++ Builder is the easiest and fastest C++ IDE for building professional FMX C++ Apps with powerful GUI components like Memo, Edit, ListBox, StringGrid, and many more. Each component can be skinned with Styles to change their visual appearance. Styles are very powerful and because of this it can sometimes take a little to get used to how they work. In this post, we explain how to change the background color of a Memo (TMemo), one of the most frequently asked questions about using styles. These methods below can be applied to other components too. How to change the background color of a Memo in C++ Builder by using Styles? Styles are sets of graphical details that define the look and feel of an application. They are one of the most beautiful and useful UI features of RAD Studio that can really add some extra professionalism to your apps. RAD Studio’s C++ Builder version comes with the award-winning VCL framework for high-performance native Windows apps (not wrapped in some kind of runtime interpretation layer) and the powerful FireMonkey (FMX) framework for cross-platform UIs. Both VCL and FMX C++ Apps support Styles. There are many styles in C++ Builder, and RAD Studio. More details about Styles can be found here. You can also find Premium Styles here. If you want to learn how you can modernize your components with styles this post has some great details; What are the steps to change the background color of a Memo in C++ Builder by using Styles? 1. Right-click on the Memo and select ‘Edit Custom Style…’ 2. Expand Memo1Style: you’ll see the background node. Click on background to select it. Then add a TRectangle via the Palette. The IDE should expand the background node and show a new Rectangle1Style tied to the TRectangle, 3. Via the Object Inspector change the Color of TRectangle as below 4. Click on the Apply Style button in the ‘Style Designer’, Save All. 5. Compile and run your application If you still have problems setting the color, this DocWiki article can help you: https://blogs.embarcadero.com/edit-custom-style-to-change-the-background-color-of-a-fmx-tedit/ How to change the background color of a Memo in C++ Builder code? If you want to change the background color of a Memo component (TMemo) in C++ Builder, first you should set the StyleLookup to “Memostyle” as shown below: Memo1->StyleLookup = “Memostyle”; If you look at the Custom Style of Memo, There is a “background” property, so we should find this resource by using FindStyleResource() method of Memo as given in the example below: Memo1->StyleLookup = “Memostyle”; auto fmxobj = Edit1->FindStyleResource(“background”, false); If this resource object we can create a rectangle (TRectangle) as a background: std::unique_ptr<TRectangle> rect(new TRectangle(fmxobj)); Here we used unique_ptr which more modern to create this rectangle. Now we can set properties of our Rectangle, including its color. rect->Align = TAlignLayout::Client; rect->Fill->Color = color; rect->Stroke->Color = color; // = claNull; rect->HitTest = false; rect->SendToBack(); Now, at last we need to add this object by using the .get() method of unique_ptr. And the final trick here is you must release this unique_ptr by using .release() otherwise it doesn’t have any effect. fmxobj->AddObject(rect.get()); rect.release(); Is there a full example of how to change the background color of a Memo in C++ Builder code? Here is a full C++ Builder FMX FMX C++ Apps example that changes the color of 3 TMemo components that has Memo1, Memo2, Memo3 names. To do this we create a ChangeMemoColor() function that uses the […]

May 13, 2023

How To Use A Game Pad Or Joystick Controller In C++ On Windows

C++ Builder

C++ On Windows is one of the most powerful programming languages that we use for all sorts of purposes, from regular applications, games, business, industrial infrastructure, robotics, and in the control of IoT devices. The most well-known controllers for those areas where human and computer interaction are important and stretches beyond simple keyboard input are joysticks or gamepads. One of the simplest examples to use them on Windows is using the venerable XInput library which has been around for quite a long time but can still be easily used with the latest C++ Compiler. In this post, we explain how you can use a gamepad or joystick controller in C++ On Windows with Xinput library. Is there a component for the gamepad or joystick in C++ On Windows? If you are looking for a ready-to-use component library, there are Delphi and C++ Builder-compatible components built on the XInput library. For example, the Controller library is a Delphi and C++ Builder component that allows applications to receive input from an Xbox Controller. The main features of this library are, Uses Windows XInput API. Available for Delphi/C++ Builder 6 – 11 and Lazarus 2.0.12. Source code included in the registered version. Royalty free distribution. You can download the trial version of the XInput library or you can buy a professional edition from Winsoft.sk. How can I control a gamepad or joystick in C++ with the Xinput Library? The XInput library is deprecated but it still supported by Microsoft. They recommend moving towards the GameInput library or Windows.Game.Input for Windows applications. If we look at these kinds of libraries (i.e GamePad.h library), like MS’ own DirectXTK, we can see that the toolkit allows one to define USING_XINPUT vs. USING_GAMEINPUT vs. USING_WINDOWS_GAMING_INPUT to pick which underlying library is used. If we compare XInput compared to GameInput: XInput library is fairly old and easy to implement Windows applications. XInput library is limited to 4 controllers. XInput library has no uniform interface to other inputs (like mouse/keyboard). XInput library input occurs with higher latency. XInput library is not friendly with other controllers. i.e. no support for Xbox One Rumble Motors. So, briefly, DirectInput is a better long-term choice than XInput. If you still want to use XInput, you can read more about https://learn.microsoft.com/en-us/windows/win32/xinput/getting-started-with-xinput XINPUT_GAMEPAD structure (declared in ) is explained here : https://learn.microsoft.com/en-us/windows/win32/api/xinput/ns-xinput-xinput_gamepad As in there, this structure has these members: wButtons, bLeftTrigger, bRightTrigger, sThumbLX, sThumbLY, sThumbRX, sThumbRY. Here wButtons member is used as a bitmask of the device digital buttons, it can be used as below, wButtons Device digital button flags Gamepad Bitmask XINPUT_GAMEPAD_DPAD_UP 0x0001 XINPUT_GAMEPAD_DPAD_DOWN 0x0002 XINPUT_GAMEPAD_DPAD_LEFT 0x0004 XINPUT_GAMEPAD_DPAD_RIGHT 0x0008 XINPUT_GAMEPAD_START 0x0010 XINPUT_GAMEPAD_BACK 0x0020 XINPUT_GAMEPAD_LEFT_THUMB 0x0040 XINPUT_GAMEPAD_RIGHT_THUMB 0x0080 XINPUT_GAMEPAD_LEFT_SHOULDER 0x0100 XINPUT_GAMEPAD_RIGHT_SHOULDER 0x0200 XINPUT_GAMEPAD_A 0x1000 XINPUT_GAMEPAD_B 0x2000 XINPUT_GAMEPAD_X 0x4000 XINPUT_GAMEPAD_Y 0x8000 How to use a gamepad or joystick in C++? If you wonder how XInput library works, you can create a simple example as in given steps below. First, we need library header to use XInput library. This is how you can use XInput library in C++. #include #include #include #pragma comment(lib, “XInput.lib”) Now, lets create a TController class that have n for the controller number and state for it. Here is an example. class TController { private: int n; XINPUT_STATE state; public: // add controller methods here }; Then we need to add some methods for this class, first lets set our private controller number n in construction like […]

July 21, 2022

TMS Web Core and More with Andrew: Miletus Desktop Intro

TMS Software

Motivation If we’ve got an excellent web application development tool, why do we need desktop applications at all? It’s a good question. And the answer, quite often, is that we don’t. This is what has made the web such an important platform, after all. And also what makes products like Chrome notebooks as popular as they are. You can accomplish quite a lot using just web applications, and for many people, it is now possible to get by exclusively with web applications alone. Products like TMS WEB Core are making this easier all the time by being able to develop substantially better applications with access to more data and more systems than ever before. And without question, web technologies have come quite a long way in a relatively short period of time. However, there are still many situations that come up where the browser sandbox is too restrictive to accomplish certain tasks. And I’m sure we’re all well aware that the browser sandbox and its rules are in place for very good reasons. So while web technologies will continue to evolve, there are some places it just isn’t going to be going anytime soon, and that’s where desktop apps come in. Here are a few examples where a desktop application solution might win out over a web application solution. An application needs access to directly read and write to a local filesystem. Application data is not permitted to leave a location (IE, saving to ‘the cloud’ poses unacceptable security risks). An application needs access to hardware that does not have an equivalent (or performant enough) web interface. Access to the application needs to be more strictly controlled. Application changes need to be more strictly controlled (i.e., SOX, ISO9000-type stuff). Users work in an environment where web browsers aren’t well-supported. Users work in an environment where desktops are strictly locked down in terms of application access. An application needs access to OS-level functionality that a browser does not have access to. Desire to standardize the application interface (avoiding non-standard browser ‘chrome’ or plugins that might interfere). Granted, there are many kinds of complexity at work here, and no doubt there are just as many ways to address certain problems. For example, a web application could be served up within a local network that has no external access at all, ensuring that data doesn’t leave that location. And there’s even an evolving web standard for accessing serial ports. Crazy, really. But in any event, there may be solid reasons for having a desktop version of a web application (or even a mobile version beyond what can be accomplished with a PWA-compliant application). Whatever the rationale, Miletus is here to help address it. Getting Started For our example application, we’re just going to carry on with the Leaflet example that we covered a couple of days ago, an almost minimalist interactive mapping web application. It has been updated slightly to fix a few minor internal errors, to be more ‘responsive’ and resize to fit its container, and also to have a slightly improved geofence data entry interface, where you can cancel the entry, see the points as a polyline while you’re entering them, change the color of the geofence created, as well as delete geofences. To get this all working, we start by creating a new TMS […]

July 19, 2022

Extend TMS WEB Core with JS Libraries with Andrew: Leaflet

TMS Software

There are so many useful JS libraries yet to explore that it can be a challenge to pick what to cover next. But this time out, we’re going to have a look at a JS library suggested by blog reader Eddy Poullet, way back in April when this blog series first started. The request? Leaflet, which bills itself as ‘a JavaScript library for interactive maps.’ And who doesn’t like interactive maps? Easily one of the more useful applications to be found on any mobile device. And while there are a number of other ways to get interactive maps into your TMS WEB Core applications, this is a good example where it is nice to have a few choices available. Motivation. Google Maps and Apple Maps tend to get most of the attention, as one of these is likely to be the default when it comes to using maps on any mobile device. And these tend to be very well integrated into their respective devices, naturally, as they’re also responsible for their respective operating systems as well. No surprise there. Desktop apps, and websites specifically, tend to be more commonly configured to use Google Maps or perhaps MapQuest or less commonly other providers, and far less frequently Apple Maps. Perhaps that will change over time as developers integrate Apple Maps into their websites. Perhaps we’ll cover that another time. But that’s historically been one of the troubles of interactive maps – jumping through hoops to get at the data. Whether it is an API key or a developer account or some kind of license or an unhelpful rate limit. Leaflet offers a bit of a different approach in that there’s nothing to do to get started in terms of API keys or developer account registration. Just load up a JS library and be immediately productive. Getting Started. As has become custom, we’ll start with a new TMS WEB Core project, using the Bootstrap template, to begin with. And then add in the necessary links to the Leaflet JavaScript and CSS files. In the project, add a TWebHTMLDiv to the form and set its Name and ElementID to ‘divMap’ just so we can reference it. To immediately see it in action, it just needs to be initialized. This can be done directly from within WebFormCreate like this, taken directly from the excellent documentation in their Quick Start Guide. procedure TForm1.WebFormCreate(Sender: TObject); begin asm var map = L.map(‘divMap’).setView([51.505, -0.09], 13); var tiles = L.tileLayer(‘https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png’, { maxZoom: 19, attribution: ‘© OpenStreetMap’ }).addTo(map); end; end; Doesn’t get much simpler than that. Using the new TWebCSSClass component in combination with Bootstrap, we can add in some rounded corners here and there and immediately get a pretty reasonable interactive map that supports zooming in/out and panning around. Leaflet up and running The interface that is rendered uses pure HTML/CSS so it is possible to change the look of things like the zoom in/out controls or other elements. The content (the map itself) consists of a collection of image tiles. Can’t do much with those directly in HTML/CSS. But there are a lot of things that can be done with what is being generated inside the tiles. And speaking of tiles, while everything so far is pretty quick and easy, there are some considerations that come with the set of tiles. In […]

July 15, 2022

Announcing FlexCel 7.15 with experimental Lazarus support

TMS Software

And today we are delivering it. Experimental support (official support is coming once FPC gets anonymous methods in trunk), but usable and working fine. While the polls were 70% in favor of supporting Lazarus, we understand it is still a small number of people needing it. But we also know that those who need it, really need it. And also, if we third-parties don’t support Lazarus, less people is going to use it, giving less incentive to make third party components, and the cycle continues. So we are going for it, and we will try to keep it working as long as supporting it isn’t an unreasonable effort. At the moment, we think it is completely feasible to keep Lazarus support along with the Delphi support. To get started, get FlexCel for Lazarus from our website, and read the Lazarus guide.

July 13, 2022

Extend TMS WEB Core with JS Libraries with Andrew: Image Sliders

TMS Software

With our Tabulator miniseries out of the way, we’re back to check out other interesting and useful JavaScript libraries that we can use in our TMS WEB Core projects. This time out, we’re going to have a look at image sliders, sometimes referred to as image carousels. There’s a TWebImageSlider included directly in TMS WEB Core that’s ready to go, based on the very capable Swiper. But we’ll also have a look at the popular Bootstrap Carousel, the venerable Slick Carousel, and the ultra-modern Glide. Each has its own default look, but they can all be customized in various ways. Some have dependencies to be mindful of. But they’re all well-tested and reliable, and any of them would make a solid addition to your project. Motivation. Whether you need some kind of image slider in your project is usually self-evident. But sliders don’t have to be used just for image content. A slider could be used instead of a combo box, displaying a set of cards to select from, where the user can cycle through different options. Or as an alternative to traditional menus. Or even to display notifications. Plenty of non-image possibilities. But no matter the type of content being displayed, a slider can have a big overall impact on a project. So finding a slider with the right mix of presentation and interaction options is important. If your project is already using Bootstrap or jQuery, then perhaps Bootstrap Carousel or Slick Carousel would be a natural fit, respectively. Or perhaps there’s a key feature in one of these sliders that with catch your attention and be important enough to your project to warrant including a dependency that wasn’t previously needed. As always, nothing but choices here, so let’s have a look. The Setup. For our examples, we’re going to use a set of 10 images of different sizes, just to make it easier to see what is going on. Generally, things work more smoothly and look considerably nicer when the images are all the same size, but that’s often not an option. The intent though is to find a slider that can be added to our Actorious project to display sets of photos of People, Movies, or TV Shows. Which will typically be all the same size, conveniently. All the sliders we’ll be looking at today have no problems displaying content of different sizes, even if we have to lean on them a little to get them to cooperate. The sample images are stored in an img folder in the example project, and a link to that can be found at the end of this post. All the sliders use URLs to reference the images, via tags, naturally, so not hard to include these. With the contents of the img folder added to our project, the images are automatically copied to either the Debug or Release folders as needed, and can just be referenced via an img/filename.png link or URL. TWebImageSlider and Swiper. The obvious first choice for a TMS WEB Core project is to use the readily available TWebImageSlider component. Let’s add this component to a new project and set the size to be 900×300, just as a set size for our examples. Then, add the sample images via the ImageURLs property in the Delphi property inspector. Without doing anything else, we get the following slider, fully […]

July 13, 2022

New TMS WEB Core v2.0 browser API support

TMS Software

It’s not a secret that the browser API supports ever more machine hardware related features, making it slowly but surely a cross-platform operating system on its own. As it is also always a goal of TMS WEB Core to make it Object Pascal developers ultra easy to take advantage of everything the browser offers, we added in TMS WEB Core v2.0 classes and a new component to take advantage of 2 new interesting browser APIs. The multi-screen API and the speech recognition API. Multi-screen API The multi-screen API allows the developer to detect from a web application, how many screens are connected to a device, retrieve the characteristics of the screens and control the placement of browser windows on these multiple screens connected to the machine.You can find the w3 spec for the multi-screen API here and a more informative article about its use https://web.dev/multi-screen-window-placement/. As we added Object Pascal classes to retrieve information from and manage these multi-screen configurations, we also created a demo that you can find in the TMS WEB Core demos folder under DemoBasicsMultiscreen and wrote a blog article about it. Now today, our chief evangelist Dr. Holger Flick also discusses it in his new video. Speech recognition API Create voice command driven web applications or write a dictaphone application that now automatically captures your spoken information as text, … it now all belongs to commonly available functionality when you use web technology. The browser speech recognition API is now available in Chrome, Edge and Safari. In TMS WEB Core v2.0, this is exposed as a non-visual component with events triggered returning spoken words as text or with a command collection the component can listen to and trigger events when the commands are spoken. In this video, Holger also explains the speech recognition API and the demo in more detail so you can get started using it in your applications easily. Miletus Note that these new web technologies are also available when you create a Miletus based native cross platform application with TMS WEB Core. Miletus applications are web technology based applications that run as native cross platform applications for Windows, macOS and Linux and also have direct access to even more operating system resources such as the file system, local databases, operating system dialogs and more. Learn more about the amazing Miletus technology in this blog article with video.

July 11, 2022

Change the look & feel of your chart empowered application with a few clicks!

TMS Software

TMS FNC Chart had a lot of customization options in terms of appearance and overall look & feel, and with a lot of property settings the result was achievable yet time consuming. In v2.0 we went the extra mile and bundled all your highly appreciated feedback into a very exciting new feature: “Global Appearance”. “Global Appearance” is a feature that allows you to customize your component with only a few lines of code, or a few clicks at designtime. Changing the overall look & feel of the chart can now be done in a couple of seconds! Global appearance is a bundle of the following settings and customization options: Monochrome color scheme Excel color scheme Custom/Extendable color list Global font color, name & size Various descendant class types for nicer finetuning To find out more about “Global Appearance”, I invite you to look at this video below. Feedback is important! The above result is based on feedback, your feedback. Sending us suggestions for new features, shortcomings & ideas to improve our products overall are always appreciated. We analyze the feedback and see what is feasible and in which time frame. Then we go ahead and assign a team of experienced developers to the task, which always results in the best possible implementation. Have some ideas? don’t hesitate to contact us and/or leave a comment below.

July 9, 2022

TMS WEB Core and More with Andrew: PWA

TMS Software

Welcome to our new TMS Blog Series, TMS WEB Core and More with Andrew. In this bi-weekly series, we’ll be looking at many aspects of developing TMS WEB Core projects, including packaging options with PWA, Miletus and Electron. We’ll look at the support available for deploying projects on various platforms, including in particular Raspberry Pi. And we’ll be looking at a few development environments where TMS WEB Core can be used, including Visual Studio Code. The other blog series, Extending TMS WEB Core with JS Libraries with Andrew, will return to its regular weekly cadence now that we’ve gotten through the Tabulator miniseries, continuing with taking a stroll through the Slick Carousel JS library next week. To start off this new series, we’re going to have a look at creating PWAs – Progressive Web Apps. We’ll have a look at what they are and what they aren’t. We’ll create one using the existing TMS WEB Core project template. And we’ll convert our ongoing Actorious project into a PWA. We’ll also have a look at some challenges with PWAs, particularly deploying updates, and have a look at some other tools that can help us out along the way. So What’s a PWA? Briefly, PWAs are essentially just your typical modern website designed with HTML, CSS, and JavaScript, much like what we’re already creating with our TMS WEB Core projects. The thinking behind PWA, in part, is that apps should try to support as many devices as possible in order to reach the largest numbers of users. And to degrade gracefully on devices that lack the latest standards, while offering the best experiences possible when device support is available. Some of the same thinking behind responsive web design. In practical terms, there are a few reasons why having your app upgraded to function as a PWA may be of interest to you. Some App Stores allow PWAs directly, rather than native apps. Notably, this isn’t necessarily the case for Apple’s App Store. Some have made it through using various PWA app-builder-type tools, so it is conceivably possible, but not really their thing. And then there’s Microsoft, who might very well add your PWA app to their App Store without even telling you. Strange times! PWA apps include functionality that makes it possible for them to work offline to some degree. Whether this makes sense for your project naturally depends on the kinds of data your app is dealing with. Storing reference information is a good use of this kind of function, and perhaps collecting data while not connected may also be feasible. Because PWA apps contain additional information about themselves, it is also often possible for the app to appear as a regular app in desktop environments, and as pseudo-apps in mobile devices, even without App Store support. Some of this you can just do separately anyway, but as a PWA app this support becomes an integral part of the project. So what does it mean then, technically, for a website to qualify as a PWA app? There are usually three basic qualifications listed. In practice, though, you’ll want to use something like Google Chrome’s Lighthouse app (part of its built-in developer tools) to analyze your app. It will let you know if you’ve come up short. We’ll have a look at […]

July 9, 2022

More new TMS WEB Core v2.0 features

TMS Software

Today we focus on two more new framework features in the new TMS WEB Core v2.0 release. It concerns the support for the different material icons types and the new component for dealing with CSS classes at design-time, TWebCSSClass. Material icons types Google Material icons is a library consolidating over 2500 glyphs for use in web applications. For some time, Google material icons offers different types of its icons. These types are: baseline, outlined, two-tone, rounded and sharp. TMS WEB Core controls offering direct support to use such Material Icons with the property MaterialGlyph now also feature the MaterialGlyphType property for selecting one of these 5 types. Manipulate CSS classes at design-time The TWebCSSClass is a non-visual component that gives design-time (but obviously also run-time) access to a wide range of CSS class properties. You can drop the component on the form, see all available CSS properties in the Object Inspector, change these, st the TWebCSSClass.CSSClassName property and then set this CSSClassName value to the control’s various Element*ClassName properties to have the CSS style applied to the control. A video is better than thousand words Watch the new video our colleague Dr. Holger Flick to show you everything in detail how you can take advantage of these new TMS WEB Core v2.0 features! And start exploring TMS WEB Core v2.0! Experience for yourself how fast you can start building your web client application front-end with TMS WEB Core and the typical Delphi RAD component based development. Download the free & fully-function trial version now. Hesitating about the back-end server that fits best with TMS WEB Core? Explore TMS XData, our flag-ship robust and high performance REST API server building library!

Abonează-te la noutăți