Android App screen differs from Designer View in Visual Studio

HaBe1963HaBe1963 NLMember ✭✭
edited February 2017 in Xamarin.Android

I have read quite a lot information about this, but can't seem to get it right. For some reason I can't get the application screen simular as what I designed in Visual Studio.

I have updated my AndroidManifext.xml to:

    <?xml version="1.0" encoding="utf-8"?>
    <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="Doorgang_Lite.Doorgang_Lite" android:versionCode="1" android:versionName="1.0">
      <uses-sdk android:minSdkVersion="16" />
      <application 
       android:label="Doorgang_Lite"
       android:theme="@android:style/Theme.NoTitleBar"/>    
    </manifest>

But no lick so far.

Below Layout was created in Visual Studio 2015 (Xamarin Android Form).

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="16dp"
    android:paddingRight="16dp">
    <TextView
        android:id="@+id/name"
        android:layout_width="match_parent"
        android:layout_height="25dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:text="Please enter your pincode" />
    <ImageView
        android:id="@+id/NmbOne"
        android:src="@drawable/oc"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/name"
        android:layout_alignParentLeft="true" />
    <ImageView
        android:id="@+id/NmbTwo"
        android:src="@drawable/oc"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/name"
        android:layout_toRightOf="@+id/NmbOne" />
    <ImageView
        android:id="@+id/NmbThree"
        android:src="@drawable/oc"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/name"
        android:layout_toRightOf="@+id/NmbTwo" />
    <ImageView
        android:id="@+id/NmbFour"
        android:src="@drawable/oc"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/name"
        android:layout_toRightOf="@+id/NmbThree" />
    <TextView
        android:id="@+id/name2"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true" />
    <ImageView
        android:id="@+id/TWEE"
        android:src="@drawable/twee"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/name2"
        android:layout_centerHorizontal="true" />
    <ImageView
        android:id="@+id/EEN"
        android:src="@drawable/een"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/name2"
        android:layout_toLeftOf="@+id/TWEE" />
    <ImageView
        android:id="@+id/DRIE"
        android:src="@drawable/drie"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/name2"
        android:layout_toRightOf="@+id/TWEE" />
    <ImageView
        android:id="@+id/VIJF"
        android:src="@drawable/vijf"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Twee"
        android:layout_centerHorizontal="true" />
    <ImageView
        android:id="@+id/VIER"
        android:src="@drawable/vier"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Een"
        android:layout_toLeftOf="@+id/VIJF" />
    <ImageView
        android:id="@+id/ZES"
        android:src="@drawable/zes"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Drie"
        android:layout_toRightOf="@+id/Vijf" />
    <ImageView
        android:id="@+id/ACHT"
        android:src="@drawable/acht"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Vijf"
        android:layout_centerHorizontal="true" />
    <ImageView
        android:id="@+id/ZEVEN"
        android:src="@drawable/zeven"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Vier"
        android:layout_toLeftOf="@+id/ACHT" />
    <ImageView
        android:id="@+id/NEGEN"
        android:src="@drawable/negen"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Zes"
        android:layout_toRightOf="@+id/Acht" />
    <ImageView
        android:id="@+id/NL"
        android:src="@drawable/nl"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Acht"
        android:layout_centerHorizontal="true" />
    <ImageView
        android:id="@+id/BLANCO"
        android:src="@drawable/blanco"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Zeven"
        android:layout_toLeftOf="@+id/NL" />
    <ImageView
        android:id="@+id/BACK"
        android:src="@drawable/back"
        android:background="#000000"
        android:padding="1dp"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Negen"
        android:layout_toRightOf="@+id/NL" />
</RelativeLayout>

Best Answers

  • HaBe1963HaBe1963 NL ✭✭
    Accepted Answer

    Thx Mabrouk. But the solution was much more simpler.

    One needs to be very carefully with caps and small caps in your XML files.
    In my case for example I referred one time to ID ""@+id/ACHT" and in a next case to "@+id/Acht".

    Building this didn't cause issues, but the result in your app is what has been described above.

Answers

  • HaBe1963HaBe1963 NLMember ✭✭
    Accepted Answer

    Thx Mabrouk. But the solution was much more simpler.

    One needs to be very carefully with caps and small caps in your XML files.
    In my case for example I referred one time to ID ""@+id/ACHT" and in a next case to "@+id/Acht".

    Building this didn't cause issues, but the result in your app is what has been described above.

Sign In or Register to comment.