When should we use dp or sp in layout?

Question

I created an android app that looks perfect on large screens. But the view gets distorted or in other terms the upper and bottom parts get cut off on smaller screens. I used sp and dp interchangably without me knowing they are different, if not same. I used sp for fonts and dp for dimensions as a rule. But this didn't work. What is the difference between sp and dp and when to use what? Thanks in advance. The xml layout file is

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/tempLabel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#CC66FF"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.coolweather.MainActivity" >

<TextView
    android:id="@+id/actualTemp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:text="@string/hundred"
    android:textColor="#FFFFFF"
    android:textSize="150sp" />

<ImageView
    android:id="@+id/degreeImageView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignTop="@+id/actualTemp"
    android:layout_toRightOf="@+id/actualTemp"
    android:paddingTop="50dp"
    android:src="@drawable/degree" />

<ImageView
    android:id="@+id/imageIcon"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/cityLabel"
    android:layout_alignParentLeft="true"
    android:layout_marginLeft="55dp"
    android:src="@drawable/cloudy" />

<TextView
    android:id="@+id/summary"
    android:textSize="19sp"
    android:textColor="#FFFFFF"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/linearLayout1"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="38dp"
    android:text="Pleasant cool day with flowers!" />

<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignRight="@+id/degreeImageView"
    android:layout_below="@+id/actualTemp"
    android:layout_marginTop="15dp"
    android:orientation="horizontal"
    android:weightSum="2" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical"
        android:paddingLeft="15dp" >

        <TextView
            android:id="@+id/humidityLabel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="Humidity"
            android:textColor="#FFFFFF"
            android:textSize="17sp" />

        <TextView
            android:id="@+id/humidity"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="80%"
            android:textColor="#FFFFFF"
            android:textSize="17sp" />
    </LinearLayout>

    <LinearLayout
         android:paddingLeft="15dp"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/precLabel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="Rain/Snow"
            android:textColor="#FFFFFF"
            android:textSize="17sp" />

        <TextView
            android:id="@+id/prcip"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="100%"
            android:textColor="#FFFFFF"
            android:textSize="17sp" />
    </LinearLayout>
</LinearLayout>

<TextView
    android:id="@+id/timeLabel"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/actualTemp"
    android:layout_centerHorizontal="true"
    android:text="At 5:00pm it will be"
    android:textColor="#80FFFFFF"
    android:textSize="20sp" />

<TextView
    android:id="@+id/cityLabel"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/timeLabel"
    android:layout_centerHorizontal="true"
    android:layout_marginBottom="37dp"
    android:text="Roorkee"
    android:textColor="#FFFFFF"
    android:textSize="22sp"
    android:layout_marginLeft="10dp" />

<ProgressBar
   android:layout_marginBottom="15dp"
    android:id="@+id/progressBar1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/imageIcon"
    android:layout_centerHorizontal="true" />

<ImageView
    android:id="@+id/refreshImageView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/progressBar1"
    android:layout_centerHorizontal="true"
    android:src="@drawable/refresh" />

Answer 1

Android建议您在设置字体大小和dp时使用sp来设置宽度，长度，高度，边距，填充等其他所有内容

Answer 2

You can use both of them for anything : heights, margins, font size, etc.

The difference is that dp is a fixed unit and sp will be scaled according to the phone font size settings.

Answer 3

sp is the recommended unit for font sizes because a user may enable low-visibility settings to increase font sizes on the device.

dp is a physical unit of measurement to translate screen resolution into a real world size. dp is calculated as resolution / density , where density is 1.0 for an mdpi screen (160dpi) and scaled accordingly based on dpi (ie. an xxhdpi screen of 480 dpi will have a density of 3.0). dp is used for all other physical elements that you wish to take up a fixed, real world size.

You need to post your layout code for us to figure out why it is getting cut off on smaller screens rather than larger ones. It is most likely because you are defining a fixed layout height/width (ie. 600 dp) which will appear fine on a tablet (which generally have minimum widths of at least 600 dp) but most phones in portrait mode will have a width of 360 dp.