Current filter:
                                You should refresh the page.
                                  • Hi,

                                    I'm using Collapse text placeholder in the platform agnostic module for my mobile application.
                                    When I reload the view the settings are reset.

                                    Kind regards,
                                    Paul

                                1 Solution

                                Creation Date Importance Sort by

                                Hello Paul,

                                The empty text area's behavior can be customized only in WinForms applications. Thus, the result of the Collapse Text Placeholder command is saved only in WinForms modules and projects. In Mobile applications, when a layout item's caption is hidden, its placeholder is not displayed. See Why the Collapse Text Placeholder command does not work in platform-independent modules for details.

                                Update:
                                To reduce the default distance between editors (e.g., when their captions are hidden), consider overriding our CSS styles in your code. To do this, you can create a controller for the Detail View of your object and register JavaScript code that will add custom CSS styles. To register them, use the MobileWindowTemplate.RegisterClientScriptOnShow method. For example, the following code removes default paddings between layout items:

                                [C#]
                                using DevExpress.ExpressApp.Mobile.Layout; using DevExpress.ExpressApp.Mobile.Templates; using DevExpress.ExpressApp; namespace MySolution.Module.Mobile.Controllers { public class MyController : ObjectViewController<DetailView, MyObject> { protected override void OnViewControlsCreated() { base.OnViewControlsCreated(); ((MobileWindowTemplate)Frame.Template).RegisterClientScriptOnShow("ChangeCSS", @" var style = document.createElement('style'); style.innerText = `.dx-layout-manager.dx-layout-manager-one-col .dx-box-item:not(:first-child) .dx-single-column-item-content>.dx-field-item {padding-top: 0!important;}`; document.head.append(style); " ); } } }

                                In the same way, you can override our other styles. Note that CSS classes used in this example can be changed in the future. I suggest you follow the How to implement CSS-related solutions for DevExpress components article to check what styles affect the layout of a particular item.

                                Alternatively, you can create a custom Mobile module and register custom CSS styles in its widget.css file. Refer to the How to: Add an XAF Mobile Custom Module topic for additional information.

                                • Paul van Keulen 07.24.2018

                                  Hi,

                                  Please view my attachment.
                                  On the left the emulator a view is shown.
                                  On three properties the caption is hide.

                                  On the right all captions are hide.

                                  On the left you can see that spacing around the first three properties.
                                  It makes no difference if the caption is shown or not.

                                  In this case it's a DetailView.

                                  Kind regards,
                                  Paul

                                • Gosha (DevExpress Support) 07.25.2018

                                  Thank you for your clarification, Paul. XAF Mobile does not provide built-in capabilities to customize this behavior. But, you may consider overriding our CSS styles in your code. To do this, you can create a controller for the Detail View of your object and register JavaScript code that will add custom CSS styles. To register them, use the MobileWindowTemplate.RegisterClientScriptOnShow method. For example, the following code removes our padding between layout items:

                                  [C#]
                                  using DevExpress.ExpressApp.Mobile.Layout; using DevExpress.ExpressApp.Mobile.Templates; using DevExpress.ExpressApp; namespace MySolution.Module.Mobile.Controllers { public class MyController : ObjectViewController<DetailView, MyObject> { protected override void OnViewControlsCreated() { base.OnViewControlsCreated(); ((MobileWindowTemplate)Frame.Template).RegisterClientScriptOnShow("ChangeCSS", @" var style = document.createElement('style'); style.innerText = `.dx-layout-manager.dx-layout-manager-one-col .dx-box-item:not(:first-child) .dx-single-column-item-content>.dx-field-item {padding-top: 0!important;}`; document.head.append(style); " ); } } }

                                  In the same way, you can override our other styles. I suggest you follow the How to implement CSS-related solutions for DevExpress components article to check what styles affect the layout of a particular item.

                                  Alternatively, you may consider creating a mobile custom module as described in the eXpressApp Framework > Task-Based Help > How to: Add an XAF Mobile Custom Module article to provide an item with a custom editor with required styles.