<commit_before>.. include:: ../LINKS.rst

.. _chapterLBlayoutMain:


猎豹 layout_main 详解
==============================================================================


什么是 layout_main 文件
------------------------------------------------------------------------------

在猎豹浏览器的皮肤文件中，一共有三个配置文件，分别是：图片显示文件（manifest.json）、图片定位文件（layout_main）、图片参数文件（layout_parameter）。
其中 layout_main 主要记录的是浏览器在最大化、标准化状态时，各个控制部分的位置。


view 的 id 元素列表
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

猎豹浏览器的皮肤配置项有两种布局方式，`layout_normal`和`layout_max`。其中`layout_normal`为猎豹浏览器在非最大化状态时的布局模式，`layout_max`则为猎豹浏览器在最大化状态时的布局模式。我们可以通过这两种不同的配置来控制猎豹浏览器在最大化和非最大化的状态。在此我们使用绿野仙踪来举例。

.. _layout_normal_max:
.. figure:: ../_static/themes/layout_normal_max.png

在猎豹浏览器的 layout_main 皮肤布局文件中，每一个功能按钮都是使用 `view` 标签表示的，例如控制主页按钮的代码为 `<view id="icon_btn" width="60" relative="left_top" delta="10 0"/>`。

.. _layout_normal_all:
.. figure:: ../_static/themes/layout_main_all.jpg

.. list-table:: view 元素列表
   :widths: 5 25 10
   :header-rows: 1

   * - 标号
     - manifest.json 参数
     - 说明
   * - 1
     - 头像按钮
     - icon_btn
   * - 2
     - 页面标题
     - title_bar
   * - 3
     - 浏览器菜单栏
     - mainmenu_bar
   * - 4
     - 系统控制条（最大化，最小化，关闭）
     - syscmd_bar
   * - 5
     - 收藏按钮
     - fav_menu_btn
   * - 6
     - 回到主页按钮
     - home_btn
   * - 7
     - 重新加载按钮
     - reload_btn
   * - 8
     - 返回按钮
     - back_btn
   * - 9
     - 向前按钮
     - forward_btn
   * - 10
     - 地址栏&搜索栏
     - tool_bar
   * - 11
     - 安全按钮
     - safe_btn
   * - 12
     - 登陆账号管理按钮
     - login_magr_btn
   * - 13
     - 下载管理按钮
     - download_btn
   * - 14
     - 书签栏
     - bookmark_bar
   * - 15
     - 标签页栏
     - tab_bar
   * - 16
     - 多标签预览
     - multi_tab_btn
   * - 17
     - “恢复上一个打开的页面”按钮
     - undo_btn
   * - 18
     - 主界面与网页之间的分割线
     - tab_separator
   * - 19
     - 页面搜索栏
     - find_bar
   * - 20
     - 信息栏
     - info_bar
   * - 21
     - 
     - tab_content
   * - 22
     - 状态栏
     - status_bar


view 标签参数详解
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

以此代码为例：`<view id="icon_btn" width="60" relative="left_top" delta="9 9"/>`


.. _LBLM-id:

- id
  - 描述：
      指定此元素的名称，例如 `icon_btn` 为浏览器的头像按钮，`title_bar` 为浏览器的菜单栏。


.. _LBLM-width:

- width
  - 描述：
      指定此元素的宽度，参数值为数字，单位默认为像素即 `px` 。例如，设置元素的宽度为80px：`width="80"`。<commit_msg>add description of tab_content<commit_after>.. include:: ../LINKS.rst

.. _chapterLBlayoutMain:


猎豹 layout_main 详解
==============================================================================


什么是 layout_main 文件
------------------------------------------------------------------------------

在猎豹浏览器的皮肤文件中，一共有三个配置文件，分别是：图片显示文件（manifest.json）、图片定位文件（layout_main）、图片参数文件（layout_parameter）。
其中 layout_main 主要记录的是浏览器在最大化、标准化状态时，各个控制部分的位置。


view 的 id 元素列表
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

猎豹浏览器的皮肤配置项有两种布局方式，`layout_normal`和`layout_max`。其中`layout_normal`为猎豹浏览器在非最大化状态时的布局模式，`layout_max`则为猎豹浏览器在最大化状态时的布局模式。我们可以通过这两种不同的配置来控制猎豹浏览器在最大化和非最大化的状态。在此我们使用绿野仙踪来举例。

.. _layout_normal_max:
.. figure:: ../_static/themes/layout_normal_max.png

在猎豹浏览器的 layout_main 皮肤布局文件中，每一个功能按钮都是使用 `view` 标签表示的，例如控制主页按钮的代码为 `<view id="icon_btn" width="60" relative="left_top" delta="10 0"/>`。

.. _layout_normal_all:
.. figure:: ../_static/themes/layout_main_all.jpg

.. list-table:: view 元素列表
   :widths: 5 25 10
   :header-rows: 1

   * - 标号
     - manifest.json 参数
     - 说明
   * - 1
     - 头像按钮
     - icon_btn
   * - 2
     - 页面标题
     - title_bar
   * - 3
     - 浏览器菜单栏
     - mainmenu_bar
   * - 4
     - 系统控制条（最大化，最小化，关闭）
     - syscmd_bar
   * - 5
     - 收藏按钮
     - fav_menu_btn
   * - 6
     - 回到主页按钮
     - home_btn
   * - 7
     - 重新加载按钮
     - reload_btn
   * - 8
     - 返回按钮
     - back_btn
   * - 9
     - 向前按钮
     - forward_btn
   * - 10
     - 地址栏&搜索栏
     - tool_bar
   * - 11
     - 安全按钮
     - safe_btn
   * - 12
     - 登陆账号管理按钮
     - login_magr_btn
   * - 13
     - 下载管理按钮
     - download_btn
   * - 14
     - 书签栏
     - bookmark_bar
   * - 15
     - 标签页栏
     - tab_bar
   * - 16
     - 多标签预览
     - multi_tab_btn
   * - 17
     - “恢复上一个打开的页面”按钮
     - undo_btn
   * - 18
     - 主界面与网页之间的分割线
     - tab_separator
   * - 19
     - 页面搜索栏
     - find_bar
   * - 20
     - 信息栏
     - info_bar
   * - 21
     - 标签内容
     - tab_content
   * - 22
     - 状态栏
     - status_bar


view 标签参数详解
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

以此代码为例：`<view id="icon_btn" width="60" relative="left_top" delta="9 9"/>`


.. _LBLM-id:

- id
  - 描述：
      指定此元素的名称，例如 `icon_btn` 为浏览器的头像按钮，`title_bar` 为浏览器的菜单栏。


.. _LBLM-width:

- width
  - 描述：
      指定此元素的宽度，参数值为数字，单位默认为像素即 `px` 。例如，设置元素的宽度为80px：`width="80"`。
{'fraction_non_alphanumeric': 0.23624389207563204, 'fraction_numerical': 0.022944550669216062, 'mean_word_length': 2.010230179028133, 'pattern_counts': {'":': 0, '<': 7, '<?xml version=': 0, '>': 7, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '90771', 'n_tokens_mistral': 2534, 'n_tokens_neox': 2663, 'n_words': 273}