Add semi-transparent overlay to activity backround at runtime - android

I have an app that i set the background to an image from xml. I get the view by calling
setContentView(R.)
.
How can i place a semi-transparent overlay on this background at runtime depending on a condition. I would like to have a red overlay with its alpha set to 50%.
I have tried creating a seperate xml file with the view duplicated and a different image/overlay but its messy as i have to inflate all the buttons/textview when i use the new view.
thanks matt
[edit1]
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/carefreebgscaledlighting"
android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:id="#+id/textviewcompanyname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#003F87" />
<TextView
android:id="#+id/textViewYouAreSignedIn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_alignParentTop="true"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#003F87"
/>
<TextView
android:id="#+id/textViewUnsentTransactions"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_below="#id/textViewYouAreSignedIn"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#003F87"
/>
[edit2]
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<RelativeLayout
android:id="#+id/transparentOverlay"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/red_transparent" >
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/carefreebgscaledlighting"
android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:id="#+id/textviewcompanyname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#003F87" />
<TextView
android:id="#+id/textViewYouAreSignedIn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_alignParentTop="true"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#003F87"
/>
[edit3]
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout
android:id="#+id/ll1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/carefreebgscaledlighting"
android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:id="#+id/textviewcompanyname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#003F87" />
.
if(status.equalsIgnoreCase(IN)){
youAreSignedInAt.setText("You are signed in at " + name);
LinearLayout layout =(LinearLayout)findViewById(R.id.ll1);
layout.setBackgroundResource(R.drawable.carefreebgscaledlightingred);
}else{
youAreSignedInAt.setText("You are not signed in");
LinearLayout layout =(LinearLayout)findViewById(R.id.ll1);
layout.setBackgroundResource(R.drawable.carefreebgscaledlighting);
}

Off the top of my head, you could declare the background color including alpha component in a resource file (i.e. colors.xml)
<color name="red_transparent">#66FF0000</color>
And then put a view (i.e. RelativeLayout), on top of the rest of the views.-
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- All your views -->
<!-- Transparent layer -->
<RelativeLayout
android:id="#+id/transparentOverlay"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/red_transparent" />
</RelativeLayout>
All you need to do is changing visibility of R.id.transparentOverlay as you desire.

Related

my list view in android seems like a square how to fix that and what is the error?

I have an android application that uses php and mysql and after fetching the from the database, the result are displayed in a listView that is handled by a BaseAdapter.
The problem is that the rows in the list seem like a square.
can anyone tell me where the mistake is in the xml files ???
activity_user_list.xml
<?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/background_1">
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
list_item.xml
<?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="wrap_content"
android:background="#drawable/background_1"
android:orientation="vertical" >
<TextView
android:id="#+id/uid"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:visibility="gone" />
<TextView
android:id="#+id/name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="text view"
android:textColor="#FFFFFF"
android:textSize="17dip"
android:textStyle="bold" />
<TextView
android:id="#+id/txtCreateDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="TextView"
android:textColor="#FFFFFF" />
</RelativeLayout>
Try removing the background image from activity_user_list.
Try remove the background of your relative layout.

layout_alignParentBottom not working as expected

I am trying to get a couple of buttons to attach to the bottom of the screen.
For some reason they are attaching themselves to the previous view:
As you can see the buttons are overwriting the previous view.
This is the layout I use:
<?xml version="1.0" encoding="utf-8" ?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:text_field_element="http://schemas.android.com/apk/res-auto"
xmlns:button_element="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:orientation="vertical"
>
<LinearLayout android:id="#+id/data_entry"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
>
<com.applicat.meuchedet.views.TextFieldElement
android:id="#+id/dental_clinics_search_screen_clinic_type_selector"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
text_field_element:prompt="#string/dental_clinic_search_screen_dental_clinic_type_prompt"
text_field_element:initial_text="#string/dental_clinic_type_initial"
text_field_element:cursor_visible="false"
/>
<include
layout="#layout/separator_element"
/>
<com.applicat.meuchedet.views.LocationSelector
android:id="#+id/dental_clinics_location_selector"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<include
layout="#layout/separator_element"
/>
<com.applicat.meuchedet.views.TimeSelector
android:id="#+id/dental_clinics_time_selector"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<include
layout="#layout/separator_element"
/>
</LinearLayout>
<com.applicat.meuchedet.views.ButtonElement
android:id="#+id/dental_clinics_search_screen_search_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
button_element:margin_bottom="10"
/>
<com.applicat.meuchedet.views.ClearButtonElement
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/dental_clinics_search_screen_search_button"
android:layout_alignParentBottom="true"
button_element:margin_bottom="10"
/>
</RelativeLayout>
separator_element.xml
<?xml version="1.0" encoding="UTF-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dip"
android:layout_marginBottom="15dip"
android:src="#drawable/form_separator"
>
</ImageView>
============================================================================
Edit:
So, it seems that the problem is caused by the fact that the view is put into a ScrollView. We need the ScrollView due to the possibility of small screens.
For some reason it sets the size wrong or something and puts the buttons just below the fields instead of at the very bottom.

Aligning ViewPager and TextView Vertically

<?xml version="1.0" encoding="utf-8"?>
<!-- Layout-Normal-Portrait -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/thumb_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<android.support.v4.view.ViewPager
android:id="#+id/mypager"
android:layout_width="fill_parent"
android:layout_height="300dp"
android:layout_above="#id/sum_layout"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true" >
</android.support.v4.view.ViewPager>
</RelativeLayout>
<RelativeLayout
android:id="#+id/sum_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#id/thumb_layout" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="6dp"
android:text="#string/lorem__ipsum"
android:textColor="#color/black" />
</RelativeLayout>
</RelativeLayout>
As soon as I run the program, it shows a error in the editor saying "error: Error: No resource found that matches the given name (at 'layout_above' with value '#id/sum_layout')." which is at line 22 in this code.
Can any one tell, what is wrong?
I wonder why you are making it so complex.
Anyways here is corrected snippet
<?xml version="1.0" encoding="utf-8"?>
<!-- Layout-Normal-Portrait -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent" > <---No need to specify android:orientation
<android.support.v4.view.ViewPager
android:id="#+id/mypager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/textView" />
<TextView
android:id="#+id/textView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:padding="6dp"
android:text="Hello"
android:textColor="#android:color/black" /> <---Place your text String here
</RelativeLayout>
use #+id/sum_layout
and clean Project and run again!
This is because you declare sum_layout id AFTER its first reference.
The best solution is to declare it in the /res/values/ids.xml like this:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<item type="id" name="sum_layout" />
</resources>
And then reference it in all your layouts without the + keyword
<android.support.v4.view.ViewPager
android:layout_above="#id/sum_layout"
/>
And
<RelativeLayout android:id="#id/sum_layout" />
Try This
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/white"
android:orientation="vertical" >
<android.support.v4.view.ViewPager
android:id="#+id/mypager"
android:layout_width="fill_parent"
android:layout_height="300dp"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true" >
</android.support.v4.view.ViewPager>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="6dp"
android:textColor="#color/black" />
When you are using relative layout, you are relating the controls with each other.when you add any control you add next control with respect to the control defined before.Likewise here you have defined view pager layout which is under layout having id #+id/sum_layout. but you have defined layout #+id/sum_layout under view pager.so it doesn't get id #+id/sum_layout,so how it will set view pager under the text view.first of all add the view and then add to its under/above.Here is your mistake:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<android.support.v4.view.ViewPager
android:id="#+id/mypager"
android:layout_width="fill_parent"
android:layout_height="300dp">
</android.support.v4.view.ViewPager>
<TextView
android:id="#+id/mytext"
android:text="#string/lorem__ipsum"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/mypager"/>
</RelativeLayout>
Set the layout according to this wherever you have to keep to its below or above.
hope it will help you.

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"

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