How to Put TextView on top of KeyboardView - android

I am trying to create a custom Android keyboard. I want to put a TextView right on top of KeyboardView.
Here's the XML. On this layout, the TextView displays on the very top of the screen. But I want to put it right on top of the keyboard, regardless the height of the keyboard. I tried playing around with layout_align*, but can't seem to do it.
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/input_view"
android:layout_height="wrap_content"
android:layout_width="match_parent"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Hello World" />
</LinearLayout>
<android.inputmethodservice.KeyboardView
android:id="#+id/keyboard"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:keyPreviewLayout ="#layout/keyboard_preview"
/>
</RelativeLayout>
Here's the screenshot.

Add android:layout_above attribute inside LinearLayout as in
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/input_view"
android:layout_height="wrap_content"
android:layout_width="match_parent"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_above="keyboard"
android:layout_height="wrap_content">
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Hello World" />
</LinearLayout>
<android.inputmethodservice.KeyboardView
android:id="#+id/keyboard"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:keyPreviewLayout ="#layout/keyboard_preview"
/>
</RelativeLayout>

Related

Using ScrollView with LinearLayout, Android

In my xml file , i have one linearLayout and a button. The linearLayout contains a lot of textViews and checkboxes. So i wanted these textViews and checkboxes to scroll but the button should remain at its place i.e it should not scroll with the textViews. For this purpose, i cover my linearLayout with scrollView like this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#drawable/homeo11" >
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/nexttodetail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginTop="10dp">
</LinearLayout>
</ScrollView>>
<Button android:id="#+id/Next4"
android:layout_gravity="right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="Next" />
</LinearLayout>
But doing this , hid my button. means the textviews and checkboxes are now scrolling properly but i can't see my next button. I try replacing the scrollView layout:height from fill_parent to wrap_content but this didn't work as well. Any help?
Use a RelativeLayout as your root View and then set your component with align_above, align_parent_top and align_parent_bottom like this:
<?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:background="#drawable/homeo11" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_above="#+id/Next4" >
<LinearLayout
android:id="#+id/nexttodetail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginTop="10dp">
(...)
</LinearLayout>
</ScrollView>>
<Button
android:id="#+id/Next4"
android:layout_gravity="right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginTop="10dp"
android:text="Next" />
</RelativeLayout>

Align a layout on top, inside other layout

I have 2 fragments, the first had the second inside it. This is the first:
<?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:background="#drawable/gradient_details_bg"
android:orientation="vertical" >
<TextView
android:id="#+id/fragmentDetailTitle"
style="#style/textTitleDetailStyle" />
<LinearLayout
android:id="#+id/detailSubObjectFrame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center"
android:orientation="vertical" >
</LinearLayout>
<Button
android:id="#+id/fragmentDetailButtonGo"
style="#style/goButtonStyle" />
</RelativeLayout>
And inside the layout detailSubObjectFrame I had others fragments. In this specific case:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/sub_take_error_Layout"
android:layout_width="wrap_content"
android:layout_height="match_parent"
>
<LinearLayout
android:id="#+id/numberErrorLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center"
android:orientation="horizontal" >
<com.mypackage.NumberPickerCustom
android:id="#+id/numberPickerCustomRandom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
max="100"
min="1"
value="30" />
<TextView
android:id="#+id/moreText"
style="#style/textOnSubmenu"
android:textSize="20sp"
android:text="#string/moreErrorText" />
</LinearLayout>
<LinearLayout
android:id="#+id/myLayoutTop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:orientation="horizontal" >
<TextView
android:id="#+id/numberOfQuestion"
style="#style/textOnSubmenu"
android:textSize="20sp"
android:text="#string/numberOfErrorQuestionText" />
<TextView
android:id="#+id/numberOfQuestionValue"
style="#style/textOnSubmenu"
android:textSize="20sp"
android:text="6" />
</LinearLayout>
</RelativeLayout>
I would like that the layout "myLayoutTop", will be placed just below the textview of the first fragment fragmentDetailTitle. (Without moving the other layout from the center).
Like you can see I tried layout_alignParentTop but didn't work.
If needed I could totally change only the layout of the 2nd fragment, the constraint that I have is that numberErrorLayout should stay (like now) on the center of the screen.
I just changed the layout of detailSubObjectFrame in a FrameLayout and sub_take_error_Layout in a LinearLayout. After I used the attribute gravity for numberErrorLayout and myLayoutTop.

How to make a edittext view fill the parent element in android

I have two edittext views. One of them has only one line, its the title. But the other one should fill the linearlayout to the end, but it doesn't.
I updated the code so this is my whole xml for this app. I hope someone can find what's wrong. The part that i want to form like this is the part inside the LinearLayout named addView.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#ffffff">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<Button
android:id="#+id/addButton"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/addbuttonstyle"
android:layout_weight="20"/>
<ImageView
android:id="#+id/titleView"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/titleview"
android:layout_weight="60"/>
<Button
android:id="#+id/orderButton"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/orderbuttonstyle"
android:layout_weight="20"/>
</LinearLayout>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/addView"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<EditText
android:id="#+id/textBoxTitle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="note title"
android:singleLine="true"
/>
<EditText
android:id="#+id/textBoxContent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:hint="content"
/>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/backgroundLayout"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/background"
/>
</FrameLayout>
I changed textBoxTitle's height to wrap_content and I see this:
Is this what you were hoping for? Also if you want content to appear in the upper-left corner use this attribute:
<EditText
...
android:gravity="top"
/>
So i found what was wrong.
I needed to set layout_height (of the textBoxContent view) to 0dp and layout_weight (of the textBoxContent view) to 1.
The first view should have android:layout_width="wrap_content"

Relative Layout, Textview not showing

I am using this XML to show my one Button at the bottom and one TextView at the top with one TextView right in the middle. The middle textview covers the whole span in between the button and the top textview. The middle TextView is not being displayed at all. What is wrong?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_alignParentBottom="true"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_above="#id/task"
android:layout_below="#id/btnAddTask"
/>
</RelativeLayout>
Your problem is definitely that you have the TasksList TextView below your button. Swap your layout_above and layout_below values. This works for me:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_alignParentBottom="true"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_above="#id/btnAddTask"
android:layout_below="#id/task"
/>
</RelativeLayout>
The problem wsa that you reversed your layout above and the layout below:
try
android:layout_below="#id/task"
android:layout_above="#id/btnAddTask"
See screenshot.
And here is the complete layout.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_alignParentBottom="true"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_below="#id/task"
android:layout_above="#id/btnAddTask"
/>
</RelativeLayout>
There's definitely something wrong with how you have this laid out.
You have for the button, alignParentBottom="true"... then for the TasksList TextView it is set to be below the button... basically off the screen.
You can remove orientation from the RelativeLayout... Relative layout's do not have orientation like LinearLayout's do.
As you're describing... I'm not 100% you can do it with a Relative Layout. If you simply wanted one thing on top, one centered and the other on bottom, it would be best to use a single layout parameter for each one, centerInParent, alignParentTop and alignParentBottom.
If you reconsider LinearLayout (as I'm guessing you started with) you'd stick with a Vertical Orientation, then give them layout_weight of 0, 1, and 0 making sure the height was set to wrap_content.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_weight="1"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_weight="0"
/>
</LinearLayout>

GUI-preview and buttons together

I need to have a video preview(on a Surface) and a TextView and a few buttons(at the bottom of the screen)
Currently, my preview's height is large but it's narrow and at the far left at the screen and the TextView is not visible.
The buttons are placed at the bottom as I require.
How do I make the preview's width large as well and the TextView visible?
Here is my layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Android Recorder"
/>
<SurfaceView android:id="#+id/camsurface"
android:layout_width="fill_parent"
android:layout_height="0px"
android:layout_weight="1" />
<TextView
android:id="#+id/recording_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" 00:00"
/>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<Button android:id="#+id/btn_settings"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Settings"/>
<Button android:id="#+id/btn_record"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Record" />
Your "preview is very small" is very small because you have it set for 140px square, hard-wired in your layout.
Either take advantage of android:layout_weight with LinearLayout, or use RelativeLayout, to make your SurfaceView take as much space as is available.
For example, here is a layout with a Button at the bottom and a WebView filling up all remaining space:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<WebView android:id="#+id/webkit"
android:layout_width="fill_parent"
android:layout_height="0px"
android:layout_weight="1"
/>
<Button android:id="#+id/helpcast"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="View Helpcast"
/>
</LinearLayout>
Corrected :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"

Categories

Resources