> For the complete documentation index, see [llms.txt](https://akulla-pro.gitbook.io/aphone/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://akulla-pro.gitbook.io/aphone/how-you-make-your-own-apps/tips-you-need-to-know.md).

# Tips you NEED to know

## How to make icons in the theme of APhone

You need to use a software supporting transparency on PNG ( So, not paint ).

After this, you need to create a image with transparent background, size 75,75.

Get a gradient you like ( I use [https://uigradients.com/](https://uigradients.com/#BlueRaspberry) and <https://webgradients.com/> ) and put it on a rounded square with 16 for the value of rounded corners. ( For the size, it's 68, 68 centered ).

Now, take a svg icon you like ( I use <https://www.flaticon.com/> ) and put it on the icon.

Now you got your icon :)

## Why doesn't my DScrollPanel work when my phone is horizontal?

You need to use <https://wiki.facepunch.com/gmod/Panel:Add> and not parenting directly

## How can I make roundedbox with every material?

Check UI - General Functions

## I can't draw my material with your roundedbox function

You need to use stencils function in UI - Stencils and draw a rectangle taking your whole panel

## What is the best way to make UI for apps?

Use font functions that adapt the size of your font.

Also, I strongly recommend that you use as many as possible docks. Avoid using magic numbers.

Doing this make it easier to adapt your UI for horizontal display

I also recommend you use Open2D as a proxy function. Like this

```
local APP = {}
// Flags of your app

function APP:Open(main, main_x, main_y, screenmode)
    // Your UI
    
    Example of adapting docks for your thing :
    local pnl = vgui.Create("DLabel", main)
    
    // http://lua-users.org/wiki/TernaryOperator
    pnl:DockMargin(0, screenmode and main_x * 0.03 or main_y*0.05, 0, 0)
    
    // Bla bla
end

function APP:Open2D(main, main_x, main_y)
    self:Open(main, main_x, main_y, true)
end
```

{% hint style="info" %}
The screen mode parameter is optional and never called in the addon, it's a parameter only you can set.
{% endhint %}