<liclass="toctree-l1 current"><aclass="current reference internal"href="#">ttkDesigner - Your first TextEditor</a><ul>
<liclass="toctree-l2"><aclass="reference internal"href="#start-a-new-project">Start a new project</a></li>
<liclass="toctree-l2"><aclass="reference internal"href="#add-the-first-buttons-undo-redo-cut-copy-paste">Add The first buttons (Undo,redo - Cut,Copy,Paste)</a></li>
<liclass="toctree-l2"><aclass="reference internal"href="#add-the-textedit-widget">Add the TextEdit widget</a></li>
<liclass="toctree-l2"><aclass="reference internal"href="#link-the-events-slots-for-the-basic-functionalities">Link the Events/Slots for the basic functionalities</a></li>
<liclass="toctree-l2"><aclass="reference internal"href="#add-few-extra-controls-open-save-color">Add few extra controls (Open/Save/Color)</a></li>
<liclass="toctree-l2"><aclass="reference internal"href="#link-the-events-slots-for-the-color-feature">Link the Events/Slots for the color feature</a></li>
<liclass="toctree-l2"><aclass="reference internal"href="#preview-and-quick-export">Preview and Quick Export</a></li>
<liclass="toctree-l2"><aclass="reference internal"href="#import-this-widget-in-your-project">Import this widget in your project</a><ul>
<liclass="toctree-l3"><aclass="reference internal"href="#option-1-include-the-open-save-routine-and-link-them-to-the-widget">Option 1) Include the Open/Save routine and link them to the widget</a></li>
<liclass="toctree-l3"><aclass="reference internal"href="#option-2-extend-a-custom-widget-including-the-open-save-methods">Option 2) Extend a custom widget including the open/save methods</a></li>
<li><p><aclass="reference internal"href="#start-a-new-project"id="id4">Start a new project</a></p></li>
<li><p><aclass="reference internal"href="#add-the-first-buttons-undo-redo-cut-copy-paste"id="id5">Add The first buttons (Undo,redo - Cut,Copy,Paste)</a></p></li>
<li><p><aclass="reference internal"href="#add-the-textedit-widget"id="id6">Add the TextEdit widget</a></p></li>
<li><p><aclass="reference internal"href="#link-the-events-slots-for-the-basic-functionalities"id="id7">Link the Events/Slots for the basic functionalities</a></p></li>
<li><p><aclass="reference internal"href="#add-few-extra-controls-open-save-color"id="id8">Add few extra controls (Open/Save/Color)</a></p></li>
<li><p><aclass="reference internal"href="#link-the-events-slots-for-the-color-feature"id="id9">Link the Events/Slots for the color feature</a></p></li>
<li><p><aclass="reference internal"href="#preview-and-quick-export"id="id10">Preview and Quick Export</a></p></li>
<li><p><aclass="reference internal"href="#import-this-widget-in-your-project"id="id11">Import this widget in your project</a></p>
<li><p><aclass="reference internal"href="#option-1-include-the-open-save-routine-and-link-them-to-the-widget"id="id12">Option 1) Include the Open/Save routine and link them to the widget</a></p></li>
<li><p><aclass="reference internal"href="#option-2-extend-a-custom-widget-including-the-open-save-methods"id="id13">Option 2) Extend a custom widget including the open/save methods</a></p></li>
<h1><aclass="reference external"href="https://github.com/ceccopierangiolieugenio/pyTermTk/tree/main/ttkDesigner">ttkDesigner</a> - Your first TextEditor<aclass="headerlink"href="#ttkdesigner-your-first-texteditor"title="Permalink to this heading"></a></h1>
<h2><aclass="toc-backref"href="#id4">Start a new project</a><aclass="headerlink"href="#start-a-new-project"title="Permalink to this heading"></a></h2>
<li><p>An Amazing Name - (This is the unique name that will be used to identify this <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.widget.html">Widget</a>)</p></li>
<li><p>Change the Layout to <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkLayouts.gridlayout.html#ttkgridlayout">TTkGridLayout</a> (This will allow all the components to be placed in a grid aligned to the content of the <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.window.html">window</a>)</p></li>
<h2><aclass="toc-backref"href="#id5">Add The first buttons (Undo,redo - Cut,Copy,Paste)</a><aclass="headerlink"href="#add-the-first-buttons-undo-redo-cut-copy-paste"title="Permalink to this heading"></a></h2>
<li><p>Define the <strong>Undo</strong>, <strong>Redo</strong> commands</p></li>
</ul>
<blockquote>
<div><ulclass="simple">
<li><p>Drag 2 <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.button.html">buttons</a> inside the <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.window.html">window</a> aligning them in the preferred <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkLayouts.gridlayout.html#ttkgridlayout">grid</a> position</p></li>
<li><p>Define the proper button Text (”<strong>Undo</strong>”,”<strong>Redo</strong>”)</p></li>
<li><p>Choose a proper unique name (This step is not mandatory but useful to identify this <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.widget.html">Widget</a>)</p></li>
<li><p>Disable those buttons by default because at the beginning the Text Editor is not going to have any Undo/Redo Buffers (I forgot to add this step in the video)</p></li>
</ul>
</div></blockquote>
<ulclass="simple">
<li><p>Define the <strong>Cut</strong>, <strong>Copy</strong>, <strong>Paste</strong> commands</p>
<h2><aclass="toc-backref"href="#id6">Add the TextEdit widget</a><aclass="headerlink"href="#add-the-textedit-widget"title="Permalink to this heading"></a></h2>
<li><p>Drag the <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.texedit.html">TextEdit</a> aligning it in the <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkLayouts.gridlayout.html#ttkgridlayout">grid</a> below any of the <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.button.html">buttons</a> previously placed</p></li>
<li><divclass="line-block">
<divclass="line">Expand the <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.texedit.html">TextEdit</a> widget in order to fill the entire area below the <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.button.html">buttons</a></div>
<divclass="line">Use the rainbow [🟥🟨🟩🩵🟦🦄] button to help identify the different widgets in the main window</div>
</div>
</li>
<li><divclass="line-block">
<divclass="line">Force the top grid to a fixed size (3 Chars)</div>
<divclass="line">In order to achieve this it is enough to force the MaxSize of any of the buttons in the top row to 3 Chars</div>
</div>
</li>
<li><p>Check the line number, this will show the line number in the <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.texedit.html">TextEdit</a> when used</p></li>
<li><p>Choose a proper unique name (This step is not mandatory but useful to identify this <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.widget.html">Widget</a>)</p></li>
<h2><aclass="toc-backref"href="#id7">Link the Events/Slots for the basic functionalities</a><aclass="headerlink"href="#link-the-events-slots-for-the-basic-functionalities"title="Permalink to this heading"></a></h2>
<divclass="line">Connect the TextEdit <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.texedit.html#TermTk.TTkWidgets.texedit.TTkTextEdit.undoAvailable">undo</a> / <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.texedit.html#TermTk.TTkWidgets.texedit.TTkTextEdit.redoAvailable">redo</a> availability signals with the <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.widget.html#TermTk.TTkWidgets.widget.TTkWidget.setEnabled">setEnabled</a> slots of the undo/redo buttons</div>
<divclass="line">This allow the TextEdit to control directly the availability status of the Buttons</div>
</div>
</li>
<li><p>Connect the undo/redo buttons <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.button.html#TermTk.TTkWidgets.button.TTkButton.clicked">clicked</a> event to the <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.texedit.html#TermTk.TTkWidgets.texedit.TTkTextEdit.undo">undo</a> / <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.texedit.html#TermTk.TTkWidgets.texedit.TTkTextEdit.redo">redo</a> slots of the TextEditor</p></li>
<li><p>Same for the <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.texedit.html#TermTk.TTkWidgets.texedit.TTkTextEdit.cut">Cut</a>, <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.texedit.html#TermTk.TTkWidgets.texedit.TTkTextEdit.copy">Copy</a>, <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.texedit.html#TermTk.TTkWidgets.texedit.TTkTextEdit.paste">Paste</a></p></li>
<h2><aclass="toc-backref"href="#id8">Add few extra controls (Open/Save/Color)</a><aclass="headerlink"href="#add-few-extra-controls-open-save-color"title="Permalink to this heading"></a></h2>
<h2><aclass="toc-backref"href="#id9">Link the Events/Slots for the color feature</a><aclass="headerlink"href="#link-the-events-slots-for-the-color-feature"title="Permalink to this heading"></a></h2>
<h2><aclass="toc-backref"href="#id10">Preview and Quick Export</a><aclass="headerlink"href="#preview-and-quick-export"title="Permalink to this heading"></a></h2>
<divclass="highlight-bash notranslate"><divclass="highlight"><pre><span></span><spanclass="c1"># If you want to try without installation, run from the pyTermTk root folder</span>
<h2><aclass="toc-backref"href="#id11">Import this widget in your project</a><aclass="headerlink"href="#import-this-widget-in-your-project"title="Permalink to this heading"></a></h2>
<p>The <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkUiTools.uiloader.html#TermTk.TTkUiTools.uiloader.TTkUiLoader">TTkUiLoader</a> provide different methods to use the content generated by <aclass="reference external"href="https://github.com/ceccopierangiolieugenio/pyTermTk/tree/main/ttkDesigner">ttkDesigner</a></p>
<p>Each method is capable of (1) returning a new <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.widget.html">Widget</a> or (2) extending a custom defined widget</p>
<h3><aclass="toc-backref"href="#id12">Option 1) Include the Open/Save routine and link them to the widget</a><aclass="headerlink"href="#option-1-include-the-open-save-routine-and-link-them-to-the-widget"title="Permalink to this heading"></a></h3>
<p>Once (quick)exported the code, we need to define the appropriate routines and link them to the file(open/save) pickers <aclass="reference external"href="https://ceccopierangiolieugenio.github.io/pyTermTk/autogen.TermTk/TermTk.TTkWidgets.TTkPickers.filepicker.html#TermTk.TTkWidgets.TTkPickers.filepicker.TTkFileButtonPicker.filePicked">signals</a></p>
<divclass="highlight-bash notranslate"><divclass="highlight"><pre><span></span><spanclass="c1"># If you want to try without installation, run from the pyTermTk root folder</span>
<h3><aclass="toc-backref"href="#id13">Option 2) Extend a custom widget including the open/save methods</a><aclass="headerlink"href="#option-2-extend-a-custom-widget-including-the-open-save-methods"title="Permalink to this heading"></a></h3>
<divclass="highlight-bash notranslate"><divclass="highlight"><pre><span></span><spanclass="c1"># If you want to try without installation, run from the pyTermTk root folder</span>
<ahref="../../005-calculator.html"class="btn btn-neutral float-left"title="pyTermTk - Your first Calculator"accesskey="p"rel="prev"><spanclass="fa fa-arrow-circle-left"aria-hidden="true"></span> Previous</a>
