# Archive/App/UI/Main window layout

From XOWA: the free, open-source, offline wiki application

This section is obsolete. Future versions will change the layout mechanism considerably.

All sections are designed to be copied and pasted directly to xowa.gfs.

## Increase font size to 10

This section increases the font size to 10 and adjusts the sizes/positions accordingly

The notes below provide rationale for the numbers if you want to increase to another size

    app.gui.layout
    // each "btn" gets +1 width and +1 height
    .go_bwd_btn .size_rel_('    +1,     +1').font_name_('Arial').font_size_(10).text_('<').owner
    .go_fwd_btn .size_rel_('    +1,     +1').font_name_('Arial').font_size_(10).text_('>').owner
    // the url_box loses -2 width because both buttons gained +1 width; it still gets +1 height for the increased font size
    .url_box    .size_rel_('    -2,     +1').font_name_('Arial').font_size_(10).owner
    // start with -22 for Windows XP Classic; decrease height by 2 to handle the +1 height to the top row and the +1 height to the bottom row
    .html_box   .size_rel_('    -8,    -24').pos_rel_(' 0,  0').owner
    // the heights are increased by +1
    .find_box   .size_rel_('     0,     +1').pos_rel_(' 0,  0').font_name_('Arial').font_size_(10).owner
    .prog_box   .size_rel_('     0,     +1').pos_rel_(' 0,  0').font_name_('Arial').font_size_(10).owner
    .note_box   .size_rel_('     0,     +1').pos_rel_(' 0,  0').font_name_('Arial').font_size_(10).owner
    ;

## Increase font size to 30

A more extreme example: font gets changed to 30, so

- height must go to +26
- the buttons widths must go to +26

    app.gui.layout
    .go_bwd_btn .size_rel_('   +26,    +26').font_name_('Arial').font_size_(30).text_('<').owner
    .go_fwd_btn .size_rel_('   +26,    +26').font_name_('Arial').font_size_(30).text_('>').owner
    .url_box    .size_rel_('    -2,    +26').font_name_('Arial').font_size_(30).owner
    .html_box   .size_rel_('    -8,    -76').owner
    .find_box   .size_rel_('     0,    +26').font_name_('Arial').font_size_(30).owner
    .prog_box   .size_rel_('     0,    +26').font_name_('Arial').font_size_(30).owner
    .note_box   .size_rel_('     0,    +26').font_name_('Arial').font_size_(30).owner
    ;

## Use absolute positions

Note that this will cause window resizing to have no effect (EX: shrink the window to 800, but the html_box will remain 1000)

    app.gui.layout
    .html_box   .mode_('abs').rect_abs_('  1000,   1000,    0,    0').owner
    .go_bwd_btn .mode_('abs').rect_abs_('    20,     20,    0, 1000').owner
    .go_fwd_btn .mode_('abs').rect_abs_('    20,     20,   20, 1000').owner
    .url_box    .mode_('abs').rect_abs_('    20,    960,   40, 1000').owner
    .find_box   .mode_('abs').rect_abs_('   200,     20,    0, 1020').owner
    .prog_box   .mode_('abs').rect_abs_('   600,     20,  200, 1020').owner
    .note_box   .mode_('abs').rect_abs_('   200,     20,  800, 1020').owner
    ;

### XOWA

- Main page
- Screenshots
- Video
- Download XOWA
- Download wikis

### Getting started

- Requirements
- Installation
- Simple Wikipedia
- English Wikipedia
- Other Wikipedias

### Android

- Setup
- Video

### Help

- About
- Contents
- Media
- Feedback

### Blog

- Current

### Links

- Wikimedia dumps
- XOWA @ archive.org
- English Wikipedia

### Donate

- archive.org
- Wikipedia