Touch UI Resizing Dialog | Community
Skip to main content
bob_smith11
bob_smith11
Level 2
March 15, 2016

Touch UI Resizing Dialog

  • March 15, 2016
  • 3 replies
  • 6034 views

Is there any way to allow the re-sizing of a dialog without having to add custom JS and CSS files?

I know that in this question answer smacdonald2008 stated you needed custom clientlib JS.
(http://help-forums.adobe.com/content/adobeforums/en/experience-manager-forum/adobe-experience-manager.topic.html/forum__2ect-how_do_wesetheight.html)

Even if this is how it is supposed to be done is there some sort of documentation for this process?

The process for creating a component has no information concerning this:
https://helpx.adobe.com/experience-manager/using/creating-touchui-component.html

Can anyone shed some light on the matter?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

3 replies

smacdonald2008
smacdonald2008
Level 10
March 15, 2016

The process for creating a component has no information concerning this:
https://helpx.adobe.com/experience-manager/using/creating-touchui-component.html

The reason why we do not cover re-sizing the dialog in that article is because this is a getting started article. Therefore we kept this article to the main steps on how to create a TOuch UI and a dialog. 

I will look within Adobe to see if we have a blog that tells you how to do this. 

If not - we will get this written up in a helpx article. 

bob_smith11
bob_smith11Author
Level 2
March 16, 2016

Thank you. It would be nice to have an article about this process.

Others have posted some blogs that I will also look at.

I only asked about the getting started guide because in that helpx adobe article you (smacdonald2008) stated that the article would be updated. Just wanted to clarify.

smacdonald2008
smacdonald2008
Level 10
March 16, 2016

We will add that to the community list for sure. We are also working on Color Picker that you brought to our attention in another thread. 

http://scottsdigitalcommunity.blogspot.ca/2016/03/how-to-create-aem-touch-ui-color-picker.html

S
stevec2515680
Level 4
March 15, 2016

See this blog http://labs.6dglobal.com/blog/2016-01-07/resizing-touch-ui-component-dialogs/

kautuk_sahni
Community Manager
kautuk_sahniCommunity Manager
Community Manager
March 16, 2016

Hi

Please find below the reference links for your help:-

Link:- http://blogs.adobe.com/contentmanagement/tag/cq-component-dialog-sizing/

1. Create a node in your component of type cq:EditConfig and name cq:editConfig, this should be a sibling of the dialog node.

2. To the cq:editConfig node add a property with name “cq:dialogMode”, type “String” and value “floating”

3. To your dialog node add two properties of type Long, name height and width and value to what the you want the size of the dialog to be.

4. That should be it. This should open the dialog with the size that you mention in the height and width properties you created in the earlier step and give the users the ability to resize the window by dragging.

 

Link 2:- http://blogs.adobe.com/contentmanagement/2011/11/17/how-to-make-the-component-dialog-floating-and-set-a-default-size/

// How to make the component dialog floating and set a default size

 

Link3 :- http://labs.6dglobal.com/blog/2016-01-07/resizing-touch-ui-component-dialogs/

// Re sizing Touch UI component dialog.

 

I hope this would help you.

Thanks and Regards

Kautuk Sahni

Kautuk Sahni
D
David_Beaudet
January 18, 2018

note: kautuksahn's first link might work for classic UI but doesn't seem to work for touch UI to control the size of a cq:dialog which is a little confusing since other properties of editconfig are still in play with touch ui.  I would hope Adobe would strive for consistency in this respect.

smacdonald2008
smacdonald2008
Level 10
January 18, 2018

I am seeing in the past year or two if anyone has written about this subject. It would most likely still be done in a similar way as discussed here -- Resizing Touch UI component dialogs | 6D Labs

Terms & ConditionsAccessibility statement

Loading footer...