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"
Related
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.
I am trying to create a ScrollView that occupies about 60% of the screen from the bottom. The screen is in landscape mode and the scrollview is the only view element in this activity. I can get it to work on a 800x480 emulator screen by forcing layout margins (see XML code below) but when I switch to a higher res screen the scrollview will occupy more than 60% of the screen and as a result it covers up some of the information on the background image. Can someone please advice on how to keep the view at around 60% of screen size, and preferably be able to handle different screen sizes?
Here is my code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/safety_base"
android:orientation="vertical"
android:padding="0dp" >
<ScrollView
android:id="#+id/scrollSafety"
android:layout_width="435dp"
android:layout_marginBottom="10dp"
android:layout_marginTop="120dp"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:scrollbars="none" >
<RelativeLayout
android:id="#+id/layoutSafety"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imgSafety"
android:contentDescription="#string/imgSafety_desc"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:src="#drawable/safety_info" />
</RelativeLayout>
</ScrollView>
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:padding="0dp" >
<ScrollView
android:id="#+id/scrollSafety"
android:layout_width="fill_parent"
android:layout_height="0px"
android:layout_weight="3"
android:background="#android:color/background_light"
android:scrollbars="none" >
<RelativeLayout
android:id="#+id/layoutSafety"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/imgSafety"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:contentDescription="Blah blah"
android:src="#drawable/icon" />
</RelativeLayout>
</ScrollView>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="0px"
android:layout_weight="2"
android:visibility="invisible"
/>
</LinearLayout>
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"
I have a header for a list that contains two image buttons. I want one of those image buttons to be on the left, and the other to be on the right. This is what my xml file looks like right now but it does not work, it just puts the two image buttons on the left together. I have also tried without the additional LinearLayouts but no luck.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:gravity="fill_horizontal"
android:background="#drawable/list_header_background">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:gravity="left"
android:background="#drawable/list_header_background">
<ImageButton
android:id="#+id/refreshBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:src="#drawable/ic_refresh"
android:background="#drawable/list_header_background"
/>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:gravity="right"
android:background="#drawable/list_header_background">
<ImageButton
android:id="#+id/battleBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:src="#drawable/ic_battle"
android:background="#drawable/list_header_background"
/>
</LinearLayout>
</LinearLayout>
As kabuko wrote, the RelativeLayout width is equal to the parent width. When we have a child view inside that RelativeLayout, we can use the android:layout_alignParentXXXXXX="true" parameter in order to align it (the child) accordingly to the parent.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:background="#drawable/list_header_background">
<ImageButton
android:id="#+id/refreshBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:src="#drawable/ic_refresh"
android:layout_alignParentLeft="true"
android:background="#drawable/list_header_background"
/>
<ImageButton
android:id="#+id/battleBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:src="#drawable/ic_battle"
android:layout_alignParentRight="true"
android:background="#drawable/list_header_background"
/>
</RelativeLayout>
You probably want to use a RelativeLayout with layout_alignParentLeft and layout_alignParentRight on the buttons.
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>