Changing TabView default colours and search bar default colours - android

okay i'm looking for a way to be able to change the orange colour that appears when you click on a tab in Android TabView
and change the orange border colour around a search bar... anyideas how to do something like that?
thats my main tab View
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<FrameLayout
android:id="#android:id/tabcontent"
android:background="#drawable/gradient_bg"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</LinearLayout>
and i have this for my search bar
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/searchText"
android:hint="#string/Search"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<ImageButton
android:id="#+id/searchButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/Search"
android:src="#drawable/search"
android:onClick="search"/>
</LinearLayout>
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:divider="#b5b5b5"
android:dividerHeight="1dp"
android:listSelector="#drawable/list_selector" />
any ideas ???
Thanks alot for all ur help!!!!


You need to use themes. You can setup a style.xml in res/values and inherit from Holo and override the properties you need to. I did this for the Tab's in the action bar:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- the theme applied to the application or activity -->
<style name="Theme.Mine" parent="android:style/Theme.Holo">
<item name="android:actionBarTabStyle">#style/MyActionBarTabStyle</item>
<item name="android:actionDropDownStyle">#style/MyDropDownNav</item>
<item name="android:selectableItemBackground">#drawable/ad_selectable_background</item>
<item name="android:popupMenuStyle">#style/MyPopupMenu</item>
<item name="android:dropDownListViewStyle">#style/MyDropDownListView</item>
<item name="android:listChoiceIndicatorMultiple">#drawable/ad_btn_check_holo_light</item>
<item name="android:listChoiceIndicatorSingle">#drawable/ad_btn_radio_holo_light</item>
</style>
<style name="MyActionBarTabStyle" >
<item name="android:background">#drawable/actionbar_tab_bg</item>
<item name="android:textColorHighlight">#FF5555</item>
<item name="android:paddingLeft">10dip</item>
<item name="android:paddingRight">10dip</item>
</style>
<style name="TableCellStyle" parent="Theme.Mine">
<item name="android:textColor">#000000</item>
<item name="android:textSize">15sp</item>
</style>
</resources>
Then you can reference this theme in your manifest file. You can read all about it here: http://developer.android.com/guide/topics/ui/themes.html

Related

Add shadow to custom dialog

I want to add shadow to my custom dialog. But how to remove this white border? Help me please)
<?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:minWidth="300dp"
android:background="#android:drawable/dialog_holo_light_frame"
android:orientation="vertical" >
<TextView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="20dp"
android:background="#color/brown"
android:gravity="top|center"
android:text=""
android:textColor="#color/white" />
...
</LinearLayout>

Add custom style
<style name="Theme.CustomDialog" parent="#android:style/Theme.Translucent.NoTitleBar">
<item name="android:windowIsFloating">true</item>
<item name="android:windowNoTitle">true</item>
<item name="android:padding">10dp</item>
<item name="android:background">#ff90ff90</item>

Separator for a two column List view not working in Android

I want to separate data of two columns in a List View by a line or any block, as shown here
I tried following solutions, unfortunately they did not work
Solution 1
Solution 2
Please check code for my application and correct me if i missed any thing
Main Activity XML
<LinearLayout 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" tools:context=".Time" android:background="#color/accent_material_dark" android:orientation="horizontal">
<TextClock android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="#+id/textClock" android:layout_gravity="center_vertical" android:format24Hour="#android:string/yes" />
</LinearLayout>
Row Layout XML
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:orientation="horizontal" android:layout_height="fill_parent" android:layout_width="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android">
<TextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="#+id/rowTextView1" style="#style/clock1"></TextView>
<TextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="#+id/rowTextView2" style="#style/clock2"></TextView>
</RelativeLayout>
Styles XML
<resources>
<!-- Clock application theme. -->
<style name="clock1">
<!-- Customize your theme here. -->
<item name="android:background">#24598a</item>
<item name="android:padding">10dp</item>
<item name="android:textSize">16sp</item>
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_alignParentLeft">true</item>
</style>
<style name="clock2">
<!-- Customize your theme here. -->
<item name="android:background">#24598a</item>
<item name="android:padding">10dp</item>
<item name="android:textSize">16sp</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_alignParentRight">true</item>
</style>
<style name="AppTheme" parent="android:style/Theme.Holo.Light.DarkActionBar"></style>
</resources>

try this example layout code for your list item view
<?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="50dp"
android:background="#color/white"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toLeftOf="#+id/divider"
android:gravity="left|center_vertical"
android:text="Some data info" />
<View
android:id="#+id/divider"
android:layout_width="1dp"
android:layout_height="match_parent"
android:layout_toLeftOf="#+id/clockInfo"
android:background="#android:color/black" />
<TextView
android:id="#+id/clockInfo"
android:layout_width="60dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:gravity="center"
android:text="11:11" />
</RelativeLayout>

Theme Style don't work on custom LiestView Items

I want to build a theme for my app. But it seems like my LiestView item don't apply the values.
This is the styles.xml:
<style name="AppTheme" parent="android:Theme.Holo.Light">
<item name="android:textViewStyle">#style/TextView</item>
</style>
<style name="TextView" parent="android:Widget.TextView">
<item name="android:layout_margin">8dp</item>
<item name="android:padding">0dp</item>
<item name="android:textColor">#87000000</item>
<item name="android:textSize">18sp</item>
</style>
in my activity i use a Listview with Custom Adapter but the TextViews from my item.xml did'nt have a margin:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:orientation="vertical"
tools:context="de.resper.enigma2chromecast.mainLive" >
<TextView
android:id="#+id/channelName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:text="#string/hello_world" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/hello_world"
android:id="#+id/channelLine1"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#android:color/darker_gray" />
</LinearLayout>

what ever you designed xml, put in android manifest file in application theme
<application android:theme="#style/CustomTheme">

Android translucent card/layout like timely app

I'm trying to copy this layout out of the beautiful Android Timely app
Specifically, the translucent box that has all the alarm info inside it. Not sure if it's a layout with a slightly different fill color than the background with the alpha value set really high.

I do something like this:
Manifest.xml
<activity
android:theme="#style/PopupTheme"
android:configChanges="orientation|screenSize"
android:name="your.package.Activity">
</activity>
Styles.xml
<style name="PopupTheme" parent="Theme.AppCompat.Base.CompactMenu.Dialog">
<item name="android:windowBackground">#android:color/transparent</item>
<item name="android:background">#android:color/transparent</item>
<item name="android:textColor">#android:color/black</item>
<item name="android:windowIsFloating">true</item>
</style>
Color.xml //You can play with the alpha value
<color name="transparent_black">#A0000000</color>
myLayout.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent"
android:gravity="center">
<LinearLayout
android:id="#+id/root"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="20dp"
android:gravity="center"
android:background="#color/transparent_black">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#android:color/transparent"
android:layout_marginTop="30dp">
<Button
android:id="#+id/guardar"
style="#style/boton_aceptar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/action_save"
android:gravity="center"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
And the result: the white part it's gonna be the current screen in the phone.

Scrollable layout

How can I make such layout? Header should not scrolls and should be always visible.
The matter is Android throws an error when I try to put ScrollView into LinearLayout.
Markup:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
style="#style/baseLayout">
<LinearLayout
style="#style/app_header" />
<ScrollView
style="#style/fillParent">
<!-- elements here -->
</ScrollView>
</LinearLayout>
Styles:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="app_theme" parent="android:Theme">
</style>
<style name="fillParent">
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">fill_parent</item>
</style>
<style name="fullWidth">
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
</style>
<style name="wrapContent">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
</style>
<style name="baseLayout" parent="fillParent">
<item name="android:orientation">vertical</item>
<item name="android:background">#drawable/app_bg</item>
</style>
<style name="app_header" parent="fullWidth">
<item name="android:background">#drawable/header_bg</item>
</style>
</resources>

The following code works for me, could you post your code and let us see what you might be doing wrong?
<?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" >
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TITLE BAR"/>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
</LinearLayout>
</ScrollView>
</LinearLayout>
Solution
The problem was that Ninja had more than 1 direct child in the ScrollView.

It's not normal if there is an error if you put a Linear layout in side a Scroll view.
Please try the below snippet in your code.
<?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="vertical" >
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TITLE BAR"/>
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
.
.
</LinearLayout>
</ScrollView>
</LinearLayout>
I hope this helps.

In your markup:
....
<ScrollView
style="#style/fillParent">
<!-- elements here -->
</ScrollView>
...
"elements here" - If more than one then you will get an error, because ScrollView can host only one direct child (for example layout).

Categories

Resources