pyqt: как поместить рамку вокруг виджета - PullRequest
0 голосов
/ 30 октября 2011

Я делаю некоторые изменения в существующем проекте PyQt. Пользовательский интерфейс был создан с помощью Qt Designer.

Соответствующей частью является QWidget, отображающий текст. Я пытаюсь поместить поля вокруг текста. Я думаю, что самый простой способ сделать это - поместить рамку вокруг QWidget, цвет фона которого совпадает с цветом фона QWidget (белый).

QWidget находится на QFrame. Я хотел бы поместить белую рамку внутри QFrame и вокруг края QWidget. Самое близкое, что я пришел, - это наложение коротких вертикальных и горизонтальных прокладок вокруг QWidget, но при этом отображается основной серый QFrame. Я не могу понять, как сделать это белым. Я бы предпочел оставить рамку серой и просто добавить белую рамку вокруг QWidget.

Любые указатели приветствуются.

EDIT:

Файл пользовательского интерфейса:

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>EbookViewer</class>
 <widget class="QMainWindow" name="EbookViewer">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>920</width>
    <height>774</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>E-book Viewer</string>
  </property>
  <property name="windowIcon">
   <iconset resource="../../../../resources/images.qrc">
    <normaloff>:/images/viewer.png</normaloff>:/images/viewer.png</iconset>
  </property>
  <widget class="QWidget" name="centralwidget">
   <layout class="QGridLayout" name="gridLayout_2">
    <item row="0" column="0">
     <widget class="QSplitter" name="splitter">
      <property name="orientation">
       <enum>Qt::Horizontal</enum>
      </property>
      <widget class="QTreeView" name="toc">
       <property name="focusPolicy">
        <enum>Qt::WheelFocus</enum>
       </property>
      </widget>
      <widget class="QFrame" name="frame">
       <property name="frameShape">
        <enum>QFrame::StyledPanel</enum>
       </property>
       <property name="frameShadow">
        <enum>QFrame::Raised</enum>
       </property>
       <layout class="QGridLayout" name="gridLayout">
        <item row="0" column="0" colspan="2">
         <widget class="QWidget" name="view_bg" native="true">
          <property name="sizePolicy">
           <sizepolicy hsizetype="Maximum" vsizetype="Maximum">
            <horstretch>0</horstretch>
            <verstretch>0</verstretch>
           </sizepolicy>
          </property>
          <property name="minimumSize">
           <size>
            <width>0</width>
            <height>0</height>
           </size>
          </property>
          <property name="styleSheet">
           <string notr="true">background:white</string>
          </property>
          <layout class="QGridLayout" name="gridLayout_3">
           <property name="leftMargin">
            <number>200</number>
           </property>
           <property name="topMargin">
            <number>30</number>
           </property>
           <property name="rightMargin">
            <number>200</number>
           </property>
           <property name="bottomMargin">
            <number>30</number>
           </property>
           <item row="0" column="0">
            <widget class="DocumentView" name="view" native="true">
             <property name="minimumSize">
              <size>
               <width>0</width>
               <height>0</height>
              </size>
             </property>
            </widget>
           </item>
          </layout>
         </widget>
        </item>
        <item row="0" column="2">
         <widget class="QScrollBar" name="vertical_scrollbar">
          <property name="orientation">
           <enum>Qt::Vertical</enum>
          </property>
         </widget>
        </item>
        <item row="1" column="1">
         <widget class="QScrollBar" name="horizontal_scrollbar">
          <property name="orientation">
           <enum>Qt::Horizontal</enum>
          </property>
         </widget>
        </item>
        <item row="2" column="1" colspan="2">
         <widget class="QFrame" name="dictionary_box">
          <property name="frameShape">
           <enum>QFrame::StyledPanel</enum>
          </property>
          <property name="frameShadow">
           <enum>QFrame::Raised</enum>
          </property>
          <layout class="QHBoxLayout" name="horizontalLayout">
           <item>
            <widget class="QWebView" name="dictionary_view">
             <property name="minimumSize">
              <size>
               <width>0</width>
               <height>150</height>
              </size>
             </property>
             <property name="url">
              <url>
               <string>about:blank</string>
              </url>
             </property>
            </widget>
           </item>
           <item>
            <widget class="QToolButton" name="close_dictionary_view">
             <property name="toolTip">
              <string>Close dictionary</string>
             </property>
             <property name="text">
              <string>...</string>
             </property>
             <property name="icon">
              <iconset resource="../../../../resources/images.qrc">
               <normaloff>:/images/window-close.png</normaloff>:/images/window-close.png</iconset>
             </property>
            </widget>
           </item>
          </layout>
         </widget>
        </item>
       </layout>
      </widget>
     </widget>
    </item>
   </layout>
  </widget>
  <widget class="QToolBar" name="tool_bar">
   <property name="sizePolicy">
    <sizepolicy hsizetype="Fixed" vsizetype="Preferred">
     <horstretch>0</horstretch>
     <verstretch>0</verstretch>
    </sizepolicy>
   </property>
   <property name="windowTitle">
    <string>toolBar</string>
   </property>
   <property name="movable">
    <bool>true</bool>
   </property>
   <property name="iconSize">
    <size>
     <width>32</width>
     <height>32</height>
    </size>
   </property>
   <property name="floatable">
    <bool>false</bool>
   </property>
   <attribute name="toolBarArea">
    <enum>LeftToolBarArea</enum>
   </attribute>
   <attribute name="toolBarBreak">
    <bool>false</bool>
   </attribute>
   <addaction name="action_back"/>
   <addaction name="action_forward"/>
   <addaction name="separator"/>
   <addaction name="action_open_ebook"/>
   <addaction name="action_copy"/>
   <addaction name="action_font_size_larger"/>
   <addaction name="action_font_size_smaller"/>
   <addaction name="action_table_of_contents"/>
   <addaction name="action_full_screen"/>
   <addaction name="separator"/>
   <addaction name="action_previous_page"/>
   <addaction name="action_next_page"/>
   <addaction name="separator"/>
   <addaction name="action_bookmark"/>
   <addaction name="action_reference_mode"/>
   <addaction name="separator"/>
   <addaction name="action_preferences"/>
   <addaction name="action_metadata"/>
   <addaction name="separator"/>
   <addaction name="action_print"/>
  </widget>
  <widget class="QToolBar" name="tool_bar2">
   <attribute name="toolBarArea">
    <enum>TopToolBarArea</enum>
   </attribute>
   <attribute name="toolBarBreak">
    <bool>false</bool>
   </attribute>
   <addaction name="action_find_next"/>
   <addaction name="action_find_previous"/>
  </widget>
  <action name="action_back">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/back.png</normaloff>:/images/back.png</iconset>
   </property>
   <property name="text">
    <string>Back</string>
   </property>
  </action>
  <action name="action_forward">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/forward.png</normaloff>:/images/forward.png</iconset>
   </property>
   <property name="text">
    <string>Forward</string>
   </property>
  </action>
  <action name="action_next_page">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/next.png</normaloff>:/images/next.png</iconset>
   </property>
   <property name="text">
    <string>Next page</string>
   </property>
  </action>
  <action name="action_previous_page">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/previous.png</normaloff>:/images/previous.png</iconset>
   </property>
   <property name="text">
    <string>Previous page</string>
   </property>
  </action>
  <action name="action_font_size_larger">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/font_size_larger.png</normaloff>:/images/font_size_larger.png</iconset>
   </property>
   <property name="text">
    <string>Font size larger</string>
   </property>
  </action>
  <action name="action_font_size_smaller">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/font_size_smaller.png</normaloff>:/images/font_size_smaller.png</iconset>
   </property>
   <property name="text">
    <string>Font size smaller</string>
   </property>
  </action>
  <action name="action_table_of_contents">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/chapters.png</normaloff>:/images/chapters.png</iconset>
   </property>
   <property name="text">
    <string>Table of Contents</string>
   </property>
  </action>
  <action name="action_metadata">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/dialog_information.png</normaloff>:/images/dialog_information.png</iconset>
   </property>
   <property name="text">
    <string>Metadata</string>
   </property>
  </action>
  <action name="action_open_ebook">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/document_open.png</normaloff>:/images/document_open.png</iconset>
   </property>
   <property name="text">
    <string>Open ebook</string>
   </property>
  </action>
  <action name="action_find_next">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/arrow-down.png</normaloff>:/images/arrow-down.png</iconset>
   </property>
   <property name="text">
    <string>Find next</string>
   </property>
   <property name="toolTip">
    <string>Find next occurrence</string>
   </property>
   <property name="shortcut">
    <string>F3</string>
   </property>
  </action>
  <action name="action_copy">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/edit-copy.png</normaloff>:/images/edit-copy.png</iconset>
   </property>
   <property name="text">
    <string>Copy to clipboard</string>
   </property>
  </action>
  <action name="action_preferences">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/config.png</normaloff>:/images/config.png</iconset>
   </property>
   <property name="text">
    <string>Preferences</string>
   </property>
  </action>
  <action name="action_reference_mode">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/lookfeel.png</normaloff>:/images/lookfeel.png</iconset>
   </property>
   <property name="text">
    <string>Reference Mode</string>
   </property>
  </action>
  <action name="action_bookmark">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/bookmarks.png</normaloff>:/images/bookmarks.png</iconset>
   </property>
   <property name="text">
    <string>Bookmark</string>
   </property>
  </action>
  <action name="action_full_screen">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/page.png</normaloff>:/images/page.png</iconset>
   </property>
   <property name="text">
    <string>Toggle full screen</string>
   </property>
  </action>
  <action name="action_print">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/print.png</normaloff>:/images/print.png</iconset>
   </property>
   <property name="text">
    <string>Print</string>
   </property>
  </action>
  <action name="action_find_previous">
   <property name="icon">
    <iconset resource="../../../../resources/images.qrc">
     <normaloff>:/images/arrow-up.png</normaloff>:/images/arrow-up.png</iconset>
   </property>
   <property name="text">
    <string>Find previous</string>
   </property>
   <property name="toolTip">
    <string>Find previous occurrence</string>
   </property>
   <property name="shortcut">
    <string>Shift+F3</string>
   </property>
  </action>
 </widget>
 <customwidgets>
  <customwidget>
   <class>QWebView</class>
   <extends>QWidget</extends>
   <header>QtWebKit/QWebView</header>
  </customwidget>
  <customwidget>
   <class>DocumentView</class>
   <extends>QWidget</extends>
   <header>calibre/gui2/viewer/documentview.h</header>
   <container>1</container>
  </customwidget>
 </customwidgets>
 <resources>
  <include location="../../../../resources/images.qrc"/>
 </resources>
 <connections/>
</ui>

1 Ответ

2 голосов
/ 30 октября 2011

Поместите QWidget внутрь другого QWidget с тем же цветом фона.

Затем вы можете использовать макет родительского элемента QWidget для настройки ширины поля с каждой стороны (все это можно сделать в Qt Designer).

EDIT

Вот шаги, которые нужно предпринять в Qt Designer для достижения этой цели:

  1. Выберите виджет кадра, содержащий текстовый виджет, и разбейте его макет.
  2. Добавить новый QWidget в виджет фрейма (вы можете назвать его "BorderWidget").
  3. Установить цвет фона виджета границы с помощью styleSheet свойство в редакторе свойств: например, background-color: white. (Примечание: это может помочь, если вы временно установите контрастный цвет, чтобы вам было легче видеть, что происходит).
  4. Перетащите текстовый виджет на виджет границы.
  5. Выберите виджет границы и установите его макет (например, «Разметка в Сетка ").
  6. Выберите виджет фрейма и установите его макет (например, «Разметка в Сетка ").
  7. Выберите виджет границы. Перейдите в раздел «Макет» в разделе «Недвижимость». Редактор. Там вы увидите свойства типа layoutTopMargin, layoutLeftMargin и т. Д., Которые можно использовать для настройки размера граница.
...