tdf#156538 Enhancement to show character information in the insert

special characters control

This patch makes a tooltip show when the mouse pointer is over a
character window in the special characters control. It also adds a
label that is used to display character information of the highlighted
character. Code for creating the character information text shown in
the tooltip and label was referenced from SvxCharacterMap.

Change-Id: I4b62e63b27310cbe9e9661ff51c2db206e9e3507
Reviewed-on: https://gerrit.libreoffice.org/c/core/+/155547
Tested-by: Jenkins
Reviewed-by: Jim Raykowski <raykowj@gmail.com>

4 files changed, 253 insertions, 181 deletions

diff --git a/sfx2/inc/charmapcontrol.hxx b/sfx2/inc/charmapcontrol.hxx
index c6045154583e..72f0328da2af 100644
--- a/sfx2/inc/charmapcontrol.hxx
+++ b/sfx2/inc/charmapcontrol.hxx
@@ -45,9 +45,12 @@ private:
 
     std::unique_ptr<weld::Label> m_xRecentLabel;
     std::unique_ptr<weld::Button> m_xDlgBtn;
+    std::unique_ptr<weld::Label> m_xCharInfoLabel;
 
+    DECL_LINK(CharFocusInHdl, SvxCharView*, void);
     DECL_LINK(CharClickHdl, SvxCharView*, void);
     DECL_LINK(OpenDlgHdl, weld::Button&, void);
+    DECL_LINK(DlgBtnFocusInHdl, weld::Widget&, void);
     DECL_LINK(UpdateRecentHdl, void*, void);
 };
 
diff --git a/sfx2/source/control/charmapcontrol.cxx b/sfx2/source/control/charmapcontrol.cxx
index c71dbc8bb402..76e37174fd49 100644
--- a/sfx2/source/control/charmapcontrol.cxx
+++ b/sfx2/source/control/charmapcontrol.cxx
@@ -105,7 +105,8 @@ SfxCharmapContainer::SfxCharmapContainer(weld::Builder& rBuilder, const VclPtr<V
 
 void SfxCharmapContainer::init(bool bHasInsert, const Link<SvxCharView*,void> &rMouseClickHdl,
                                const Link<void*, void>& rUpdateFavHdl,
-                               const Link<void*, void>& rUpdateRecentHdl)
+                               const Link<void*, void>& rUpdateRecentHdl,
+                               const Link<SvxCharView*,void> &rFocusInHdl)
 {
     m_aUpdateFavHdl = rUpdateFavHdl;
     m_aUpdateRecentHdl = rUpdateRecentHdl;
@@ -118,10 +119,12 @@ void SfxCharmapContainer::init(bool bHasInsert, const Link<SvxCharView*,void> &r
     for(int i = 0; i < 16; i++)
     {
         m_aRecentCharView[i].SetHasInsert(bHasInsert);
+        m_aRecentCharView[i].setFocusInHdl(rFocusInHdl);
         m_aRecentCharView[i].setMouseClickHdl(rMouseClickHdl);
         m_aRecentCharView[i].setClearClickHdl(LINK(this, SfxCharmapContainer, RecentClearClickHdl));
         m_aRecentCharView[i].setClearAllClickHdl(LINK(this, SfxCharmapContainer, RecentClearAllClickHdl));
         m_aFavCharView[i].SetHasInsert(bHasInsert);
+        m_aFavCharView[i].setFocusInHdl(rFocusInHdl);
         m_aFavCharView[i].setMouseClickHdl(rMouseClickHdl);
         m_aFavCharView[i].setClearClickHdl(LINK(this, SfxCharmapContainer, FavClearClickHdl));
         m_aFavCharView[i].setClearAllClickHdl(LINK(this, SfxCharmapContainer, FavClearAllClickHdl));
@@ -135,11 +138,16 @@ SfxCharmapCtrl::SfxCharmapCtrl(CharmapPopup* pControl, weld::Widget* pParent)
     , m_aCharmapContents(*m_xBuilder, m_xVirDev, false)
     , m_xRecentLabel(m_xBuilder->weld_label("label2"))
     , m_xDlgBtn(m_xBuilder->weld_button("specialchardlg"))
+    , m_xCharInfoLabel(m_xBuilder->weld_label("charinfolabel"))
 {
+    m_xCharInfoLabel->set_size_request(-1, m_xCharInfoLabel->get_text_height() * 2);
+
     m_aCharmapContents.init(false, LINK(this, SfxCharmapCtrl, CharClickHdl),
-                            Link<void*,void>(), LINK(this, SfxCharmapCtrl, UpdateRecentHdl));
+                            Link<void*,void>(), LINK(this, SfxCharmapCtrl, UpdateRecentHdl),
+                            LINK(this, SfxCharmapCtrl, CharFocusInHdl));
 
     m_xDlgBtn->connect_clicked(LINK(this, SfxCharmapCtrl, OpenDlgHdl));
+    m_xDlgBtn->connect_focus_in(LINK(this, SfxCharmapCtrl, DlgBtnFocusInHdl));
 }
 
 SfxCharmapCtrl::~SfxCharmapCtrl()
@@ -209,6 +217,11 @@ void SfxCharmapContainer::getRecentCharacterList()
     m_aRecentCharFontList.resize(nCommonLength);
 }
 
+IMPL_LINK(SfxCharmapCtrl, CharFocusInHdl, SvxCharView*, pView, void)
+{
+    m_xCharInfoLabel->set_label(pView->GetCharInfoText());
+}
+
 IMPL_LINK(SfxCharmapCtrl, CharClickHdl, SvxCharView*, pView, void)
 {
     m_xControl->EndPopupMode();
@@ -227,6 +240,11 @@ IMPL_LINK_NOARG(SfxCharmapCtrl, OpenDlgHdl, weld::Button&, void)
     }
 }
 
+IMPL_LINK_NOARG(SfxCharmapCtrl, DlgBtnFocusInHdl, weld::Widget&, void)
+{
+    m_xCharInfoLabel->set_label("");
+}
+
 void SfxCharmapCtrl::GrabFocus()
 {
     m_aCharmapContents.GrabFocusToFirstFavorite();
diff --git a/sfx2/source/control/charwin.cxx b/sfx2/source/control/charwin.cxx
index b94d2bcd1e82..50c7099a84a7 100644
--- a/sfx2/source/control/charwin.cxx
+++ b/sfx2/source/control/charwin.cxx
@@ -29,6 +29,10 @@
 
 #include <com/sun/star/beans/PropertyValue.hpp>
 
+#include <o3tl/temporary.hxx>
+#include <unicode/uchar.h>
+#include <unicode/utypes.h>
+
 using namespace com::sun::star;
 
 SvxCharView::SvxCharView(const VclPtr<VirtualDevice>& rVirDev)
@@ -52,10 +56,41 @@ void SvxCharView::SetDrawingArea(weld::DrawingArea* pDrawingArea)
     mxVirDev->Pop();
 }
 
-void SvxCharView::GetFocus() { Invalidate(); }
+void SvxCharView::GetFocus()
+{
+    Invalidate();
+    if (maFocusInHdl.IsSet())
+        maFocusInHdl.Call(this);
+}
 
 void SvxCharView::LoseFocus() { Invalidate(); }
 
+OUString SvxCharView::GetCharInfoText()
+{
+    OUString charValue = GetText();
+    sal_UCS4 nDecimalValue = charValue.iterateCodePoints(&o3tl::temporary(sal_Int32(1)), -1);
+    /* get the character name */
+    UErrorCode errorCode = U_ZERO_ERROR;
+    // icu has a private uprv_getMaxCharNameLength function which returns the max possible
+    // length of this property. Unicode 3.2 max char name length was 83
+    char buffer[100];
+    u_charName(nDecimalValue, U_UNICODE_CHAR_NAME, buffer, sizeof(buffer), &errorCode);
+    if (U_SUCCESS(errorCode))
+    {
+        OUString aHexText = OUString::number(nDecimalValue, 16).toAsciiUpperCase();
+        return charValue + u" " + OUString::createFromAscii(buffer) + u" U+" + aHexText;
+    }
+    return OUString();
+}
+
+OUString SvxCharView::RequestHelp(tools::Rectangle& rHelpRect)
+{
+    OUString sCharInfoText(GetCharInfoText());
+    // Gtk3 requires a help rectangle be supplied for the tooltip to display, X11 does not.
+    mxVirDev->GetTextBoundRect(rHelpRect, sCharInfoText);
+    return sCharInfoText;
+}
+
 bool SvxCharView::MouseButtonDown(const MouseEvent& rMEvt)
 {
     if (rMEvt.IsLeft())
@@ -221,6 +256,8 @@ void SvxCharView::Paint(vcl::RenderContext& rRenderContext, const tools::Rectang
         rRenderContext.SetFont(aOrigFont);
 }
 
+void SvxCharView::setFocusInHdl(const Link<SvxCharView*, void>& rLink) { maFocusInHdl = rLink; }
+
 void SvxCharView::setMouseClickHdl(const Link<SvxCharView*, void>& rLink)
 {
     maMouseClickHdl = rLink;
diff --git a/sfx2/uiconfig/ui/charmapcontrol.ui b/sfx2/uiconfig/ui/charmapcontrol.ui
index 28a080a88433..24c6e8d00482 100644
--- a/sfx2/uiconfig/ui/charmapcontrol.ui
+++ b/sfx2/uiconfig/ui/charmapcontrol.ui
@@ -1,22 +1,22 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<!-- Generated with glade 3.36.0 -->
+<!-- Generated with glade 3.40.0 -->
 <interface domain="sfx">
   <requires lib="gtk+" version="3.20"/>
   <object class="GtkPopover" id="charmapctrl">
-    <property name="can_focus">False</property>
-    <property name="no_show_all">True</property>
-    <property name="border_width">4</property>
+    <property name="can-focus">False</property>
+    <property name="no-show-all">True</property>
+    <property name="border-width">4</property>
     <property name="constrain-to">none</property>
     <child>
       <object class="GtkBox" id="container">
         <property name="visible">True</property>
-        <property name="can_focus">False</property>
+        <property name="can-focus">False</property>
         <property name="orientation">vertical</property>
         <property name="spacing">6</property>
         <child>
           <object class="GtkLabel" id="label1">
             <property name="visible">True</property>
-            <property name="can_focus">False</property>
+            <property name="can-focus">False</property>
             <property name="label" translatable="yes" context="charmapcontrol|label1">Favorites</property>
           </object>
           <packing>
@@ -26,219 +26,219 @@
           </packing>
         </child>
         <child>
-          <!-- n-columns=1 n-rows=1 -->
+          <!-- n-columns=6 n-rows=3 -->
           <object class="GtkGrid" id="favgrid">
             <property name="visible">True</property>
-            <property name="can_focus">False</property>
+            <property name="can-focus">False</property>
             <property name="halign">start</property>
-            <property name="row_spacing">3</property>
-            <property name="column_spacing">3</property>
+            <property name="row-spacing">3</property>
+            <property name="column-spacing">3</property>
             <child>
               <object class="GtkDrawingArea" id="favchar1">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">0</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">0</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar2">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">1</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">1</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar4">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">3</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">3</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar3">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">2</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">2</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar5">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">4</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">4</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar6">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">5</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">5</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar7">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">0</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">0</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar8">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">1</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">1</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar9">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">2</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">2</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar10">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">3</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">3</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar11">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">4</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">4</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar12">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">5</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">5</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar13">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">0</property>
-                <property name="top_attach">2</property>
+                <property name="left-attach">0</property>
+                <property name="top-attach">2</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar14">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">1</property>
-                <property name="top_attach">2</property>
+                <property name="left-attach">1</property>
+                <property name="top-attach">2</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar15">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">2</property>
-                <property name="top_attach">2</property>
+                <property name="left-attach">2</property>
+                <property name="top-attach">2</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="favchar16">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">3</property>
-                <property name="top_attach">2</property>
+                <property name="left-attach">3</property>
+                <property name="top-attach">2</property>
               </packing>
             </child>
             <child>
@@ -257,7 +257,7 @@
         <child>
           <object class="GtkLabel" id="label2">
             <property name="visible">True</property>
-            <property name="can_focus">False</property>
+            <property name="can-focus">False</property>
             <property name="label" translatable="yes" context="charmapcontrol|label2">Recent</property>
           </object>
           <packing>
@@ -267,219 +267,219 @@
           </packing>
         </child>
         <child>
-          <!-- n-columns=1 n-rows=1 -->
+          <!-- n-columns=6 n-rows=3 -->
           <object class="GtkGrid" id="viewgrid">
             <property name="visible">True</property>
-            <property name="can_focus">False</property>
+            <property name="can-focus">False</property>
             <property name="halign">start</property>
-            <property name="row_spacing">3</property>
-            <property name="column_spacing">3</property>
+            <property name="row-spacing">3</property>
+            <property name="column-spacing">3</property>
             <child>
               <object class="GtkDrawingArea" id="viewchar1">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">0</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">0</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar2">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">1</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">1</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar4">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">3</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">3</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar3">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">2</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">2</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar5">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">4</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">4</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar6">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">5</property>
-                <property name="top_attach">0</property>
+                <property name="left-attach">5</property>
+                <property name="top-attach">0</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar16">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">3</property>
-                <property name="top_attach">2</property>
+                <property name="left-attach">3</property>
+                <property name="top-attach">2</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar15">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">2</property>
-                <property name="top_attach">2</property>
+                <property name="left-attach">2</property>
+                <property name="top-attach">2</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar14">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">1</property>
-                <property name="top_attach">2</property>
+                <property name="left-attach">1</property>
+                <property name="top-attach">2</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar13">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">0</property>
-                <property name="top_attach">2</property>
+                <property name="left-attach">0</property>
+                <property name="top-attach">2</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar12">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">5</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">5</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar11">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">4</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">4</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar10">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">3</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">3</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar9">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">2</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">2</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar8">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">1</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">1</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
               <object class="GtkDrawingArea" id="viewchar7">
-                <property name="width_request">35</property>
-                <property name="height_request">35</property>
+                <property name="width-request">35</property>
+                <property name="height-request">35</property>
                 <property name="visible">True</property>
-                <property name="can_focus">True</property>
+                <property name="can-focus">True</property>
                 <property name="events">GDK_BUTTON_MOTION_MASK | GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_STRUCTURE_MASK</property>
               </object>
               <packing>
-                <property name="left_attach">0</property>
-                <property name="top_attach">1</property>
+                <property name="left-attach">0</property>
+                <property name="top-attach">1</property>
               </packing>
             </child>
             <child>
@@ -496,16 +496,30 @@
           </packing>
         </child>
         <child>
+          <object class="GtkLabel" id="charinfolabel">
+            <property name="visible">True</property>
+            <property name="can-focus">False</property>
+            <property name="justify">center</property>
+            <property name="wrap">True</property>
+            <property name="yalign">0.5</property>
+          </object>
+          <packing>
+            <property name="expand">False</property>
+            <property name="fill">True</property>
+            <property name="position">4</property>
+          </packing>
+        </child>
+        <child>
           <object class="GtkButton" id="specialchardlg">
             <property name="label" translatable="yes" context="charmapcontrol|specialchardlg">More Characters…</property>
             <property name="visible">True</property>
-            <property name="can_focus">True</property>
-            <property name="receives_default">True</property>
+            <property name="can-focus">True</property>
+            <property name="receives-default">True</property>
           </object>
           <packing>
             <property name="expand">False</property>
             <property name="fill">True</property>
-            <property name="position">4</property>
+            <property name="position">5</property>
           </packing>
         </child>
       </object>