I want to change the default blue color to anything else...
After some research, I tried to use the website Android Holo Colors Generator. I downloaded the files from the website and I added them to my android app but I got two errors:
- Attribute "divider" has already been defined attrs.xml, .../res/values, line 6 Android AAPT Problem
- Error: No resource found that matches the given name (at 'drawable' with value '@color/transparent'). item_background_holo_light.xml, ../res/drawable, line 25 Android AAPT Problem
I tried to comment the two lines but there is no changes applied. Is there any advice or help?
The error you are getting is because your project or a referenced project (like the acionbarSherlock) has an attribute already using that name. You can address this issue using the steps below
1) Feel free to comment out that attribute
2) Define your custom divider R.drawable.customDivider:
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<size android:width="1dip" />
<solid android:color="#666666" />
</shape>
3) use setDividerDrawable to set your
mTabHost.getTabWidget().setDividerDrawable(getResources().getDrawable(R.drawable.customDivider));
Note: android:divider layout property is only available in android Honeycomb or higher so we need to set programmatically.
The holo generator site is not very informative when implementing their artifacts but very handy resource. See below for full implementation.
NOTE Another option would be to use the Holo Everywhere library for pre-Honeycomb styling support.
After adding the downloaded files into your project, you will want to implemented something like below.
Note: These tabs are implemented inside a Fragment
Conditionaly apply the indicator downloaded:
public class TabsFrag extends Fragment {
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
FragmentTabHost retval = (FragmentTabHost)inflater.inflate(R.layout.home_tabbed_view, container, false);
return retval;
}
public void onActivityCreated(Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
FragmentTabHost mTabHost = (FragmentTabHost)getView().findViewById(android.R.id.tabhost);
mTabHost.setup(getActivity(), getActivity().getSupportFragmentManager(), R.id.realtabcontent);
//This is for stying to be the same across SDKs, we are supporting pre.
if(android.os.Build.VERSION.SDK_INT < android.os.Build.VERSION_CODES.HONEYCOMB)
{
mTabHost.getTabWidget().setDividerDrawable(getResources().getDrawable(R.drawable.customDivider));
View tab1Indicator = getActivity().getLayoutInflater().inflate(R.layout.tab_indicator_holo, mTabHost.getTabWidget(), false);
View tab2Indicator = getActivity().getLayoutInflater().inflate(R.layout.tab_indicator_holo, mTabHost.getTabWidget(), false);
((TextView) tab1Indicator.findViewById(android.R.id.title)).setText("Tab 1 label");
mTabHost.addTab(mTabHost.newTabSpec("TAB1").setIndicator(tab1Indicator),
MenuHomeDashboard.class, null);
((TextView) tab2Indicator.findViewById(android.R.id.title)).setText("Tab 2 label");
mTabHost.addTab(mTabHost.newTabSpec("TAB2").setIndicator(tab2Indicator),
MenuHomeNewsFeed.class, null);
}
else //No need to use the generated style unless you want to.
{
mTabHost.addTab(mTabHost.newTabSpec("TAB1").setIndicator("Tab 1 label"),
MenuHomeDashboard.class, null);
mTabHost.addTab(mTabHost.newTabSpec("TAB2").setIndicator("Tab 2 label"),
MenuHomeNewsFeed.class, null);
}
}
}
Your custom Tab layout: R.home_tabbed_view
<android.support.v4.app.FragmentTabHost
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TabWidget
android:id="@android:id/tabs"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"/>
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0"/>
<FrameLayout
android:id="@+id/realtabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
And the R.layout.tab_indicator_holo layout you should of received from the holo color generator
<!-- Copyright (C) 2011 The Android Open Source Project
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="@dimen/tab_host_default_height"
android:orientation="horizontal"
style="@style/TabAppTheme"
android:gravity="center">
<ImageView
android:id="@android:id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:visibility="gone"
android:contentDescription="@null" />
<TextView
android:id="@android:id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
style="@style/TabTextAppTheme" />
</LinearLayout>