Re: RTE custom dialog skin

  •  08-21-2013, 12:15 PM

    Re: RTE custom dialog skin

    Hi dfree79,

     

    The Rich TextEditor dialogs are generated by our own frame jsml. If you need to use the same style dialog, you can try the way below.

     

    1. Create your own dialog file, for example name it to "mydialog.xml" under \richtexteditor\dialogs\mydialog.xml with the code below.

     

          the code below means use the base dialog settings/styles of rte.

     

                <include src="{folder}dialogs/browsedialogbase.xml?{timems}" />

     

          the code below use to set the custom style and title.

     

                <execute>            dialog.set_back_color("#F9F9F9");            dialog.set_title(editor.GetLangText("custom dialog"));      </execute> 

     

           the code below use to generate a panel by jsml format code. you can use this format to generate the button/text field/dorpdown list etc.

     

                <panel jsml-class="insertimagedialog" jsml-base="browsedialogbase" dock="fill" margin="3">      </panel> 

    1. <?xml version="1.0" encoding="utf-8" ?>  
    2. <jsml xmlns="http://cutesoft.net/jsml"  
    3. xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://cutesoft.net/jsml ../core/jsml.xsd">  
    4.   
    5.     <include src="{folder}dialogs/browsedialogbase.xml?{timems}" />  
    6.   
    7.     <execute>  
    8.         dialog.set_back_color("#F9F9F9");  
    9.         dialog.set_title(editor.GetLangText("custom dialog"));  
    10.     </execute>  
    11.   
    12.   
    13.     <!-- # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #   
    14.             class insertimagedialog  
    15.      # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # -->  
    16.     <panel jsml-class="insertimagedialog" jsml-base="browsedialogbase" dock="fill" margin="3">  
    17.     </panel>  
    18. </jsml>  
     

    2. Open the custom dialog by the code below. Method "ShowXmlDialog" use to open the dialog. newoption is the settings of this dialog.

     

    1. var newoption = { width: 640, height: 420 };  
    2.                 newoption.nestedmode = true;  
    3.                 newoption.callback = function () {  
    4.                     self.bubble_event("reloadvalue");  
    5.                 }  
    6.                 editor.ShowXmlDialog(editor.BuildDialogUrl("mydialog.xml"), newoption);  
     

    Regards,

     

    Ken 

View Complete Thread