Keyboard Row won't fill the whole screen

Question

I'm trying to create a Custom Keyboard and did two exactly identical layouts as follows:

keyboard.xml

<?xml version="1.0" encoding="utf-8"?>
<Keyboard
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:verticalGap="4px"
    android:keyHeight="110px"
    android:keyWidth="10%p"
    android:horizontalGap="0.1%p"
    >
    <Row>
        <Key android:codes="113" android:keyLabel="q" android:keyEdgeFlags="left"/>
        <Key android:codes="119" android:keyLabel="w" />
        <Key android:codes="101" android:keyLabel="e" />
        <Key android:codes="114" android:keyLabel="r" />
        <Key android:codes="116" android:keyLabel="t" />
        <Key android:codes="121" android:keyLabel="y" />
        <Key android:codes="117" android:keyLabel="u" />
        <Key android:codes="105" android:keyLabel="i" />
        <Key android:codes="111" android:keyLabel="o" />
        <Key android:codes="112" android:keyLabel="p" android:keyEdgeFlags="right"/>
    </Row>
    <Row>
        <Key android:codes="97" android:keyLabel="a" android:horizontalGap="4.6%p" android:keyEdgeFlags="left"/>
        <Key android:codes="115" android:keyLabel="s" />
        <Key android:codes="100" android:keyLabel="d" />
        <Key android:codes="102" android:keyLabel="f" />
        <Key android:codes="103" android:keyLabel="g" />
        <Key android:codes="104" android:keyLabel="h" />
        <Key android:codes="106" android:keyLabel="j" />
        <Key android:codes="107" android:keyLabel="k" />
        <Key android:codes="108" android:keyLabel="l" android:keyEdgeFlags="right"/>
    </Row>
    <Row>
        <Key android:codes="-1" android:keyIcon="@drawable/shift_icon" android:keyWidth="12%p" android:keyEdgeFlags="left"/>
        <Key android:codes="122" android:keyLabel="z" android:horizontalGap="2.7%p"/>
        <Key android:codes="120" android:keyLabel="x" />
        <Key android:codes="99" android:keyLabel="c" />
        <Key android:codes="118" android:keyLabel="v" />
        <Key android:codes="98" android:keyLabel="b" />
        <Key android:codes="110" android:keyLabel="n" />
        <Key android:codes="109" android:keyLabel="m"/>
        <Key android:codes="-5" android:keyIcon="@drawable/backspace_icon" android:horizontalGap="2.7%p" android:isRepeatable="true" android:keyWidth="12%p" android:keyEdgeFlags="right"/>
    </Row>
    <Row android:rowEdgeFlags="bottom">
        <Key android:codes="-10" android:keyLabel="123" android:keyWidth="12%p" android:keyEdgeFlags="left"/>
        <Key android:codes="44" android:keyLabel="," android:keyWidth="12.6%p" />
        <Key android:codes="32" android:keyLabel="SPACE" android:keyWidth="50.4%p" />
        <Key android:codes="46" android:keyLabel="." android:keyWidth="12.6%p" />
        <Key android:codes="-4" android:keyLabel="OK" android:keyWidth="12%p" android:keyEdgeFlags="right"/>
    </Row>
</Keyboard>

symbols_num_keyboard.xml

<?xml version="1.0" encoding="utf-8"?>
<Keyboard
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:verticalGap="4px"
    android:keyHeight="110px"
    android:keyWidth="10%p"
    android:horizontalGap="0.1%p"
    >
    <Row>
        <Key android:codes="113" android:keyLabel="q" android:keyEdgeFlags="left"/>
        <Key android:codes="119" android:keyLabel="w" />
        <Key android:codes="101" android:keyLabel="e" />
        <Key android:codes="114" android:keyLabel="r" />
        <Key android:codes="116" android:keyLabel="t" />
        <Key android:codes="121" android:keyLabel="y" />
        <Key android:codes="117" android:keyLabel="u" />
        <Key android:codes="105" android:keyLabel="i" />
        <Key android:codes="111" android:keyLabel="o" />
        <Key android:codes="112" android:keyLabel="p" android:keyEdgeFlags="right"/>
    </Row>
    <Row>
        <Key android:codes="97" android:keyLabel="a" android:horizontalGap="4.6%p" android:keyEdgeFlags="left"/>
        <Key android:codes="115" android:keyLabel="s" />
        <Key android:codes="100" android:keyLabel="d" />
        <Key android:codes="102" android:keyLabel="f" />
        <Key android:codes="103" android:keyLabel="g" />
        <Key android:codes="104" android:keyLabel="h" />
        <Key android:codes="106" android:keyLabel="j" />
        <Key android:codes="107" android:keyLabel="k" />
        <Key android:codes="108" android:keyLabel="l" android:keyEdgeFlags="right"/>
    </Row>
    <Row>
        <Key android:codes="-1" android:keyIcon="@drawable/shift_icon" android:keyWidth="12%p" android:keyEdgeFlags="left"/>
        <Key android:codes="122" android:keyLabel="z" android:horizontalGap="2.7%p"/>
        <Key android:codes="120" android:keyLabel="x" />
        <Key android:codes="99" android:keyLabel="c" />
        <Key android:codes="118" android:keyLabel="v" />
        <Key android:codes="98" android:keyLabel="b" />
        <Key android:codes="110" android:keyLabel="n" />
        <Key android:codes="109" android:keyLabel="m"/>
        <Key android:codes="-5" android:keyIcon="@drawable/backspace_icon" android:horizontalGap="2.7%p" android:isRepeatable="true" android:keyWidth="12%p" android:keyEdgeFlags="right"/>
    </Row>
    <Row android:rowEdgeFlags="bottom">
        <Key android:codes="-10" android:keyLabel="123" android:keyWidth="12%p" android:keyEdgeFlags="left"/>
        <Key android:codes="44" android:keyLabel="," android:keyWidth="12.6%p" />
        <Key android:codes="32" android:keyLabel="SPACE" android:keyWidth="50.4%p" />
        <Key android:codes="46" android:keyLabel="." android:keyWidth="12.6%p" />
        <Key android:codes="-4" android:keyLabel="OK" android:keyWidth="12%p" android:keyEdgeFlags="right"/>
    </Row>
</Keyboard>

However when I switch between these two screens, I observe a difference in layout spaces between keys as follows:

Why is this happening? , Is there anyway I can get around this?

Answer 1

Your problem might be probably due to this

android:horizontalGap="2.7%p"

Try replacing your ZXC... row with the following

<Row>
    <Key android:codes="-1" android:keyIcon="@drawable/sym_keyboard_shift" 
            android:keyWidth="15%p" android:isModifier="true"
            android:isSticky="true" android:keyEdgeFlags="left"/>
    <Key android:codes="122" android:keyLabel="z"/>
    <Key android:codes="120" android:keyLabel="x"/>
    <Key android:codes="99" android:keyLabel="c"/>
    <Key android:codes="118" android:keyLabel="v"/>
    <Key android:codes="98" android:keyLabel="b"/>
    <Key android:codes="110" android:keyLabel="n"/>
    <Key android:codes="109" android:keyLabel="m"/>
    <Key android:codes="-5" android:keyIcon="@drawable/sym_keyboard_delete" 
            android:keyWidth="15%p" android:keyEdgeFlags="right"
            android:isRepeatable="true"/>
</Row>