<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginHorizontal="#dimen/para"
android:layout_weight="0.5"
android:background="#color/gray_medium_dark"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:id="#+id/messages_parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout style="#style/hor_layout">
<TextView
style="#style/message_text"
android:background="#color/gray_blue_medium"
android:text="#string/dummy_short" />
<Space style="#style/message_space" />
</LinearLayout>
</LinearLayout>
</ScrollView>
Above is my xml and I want to add a LinearLayout packed with a TextView and Space to the LinearLayout with the id messages_parent. I want it to happen when a button is pressed.
private fun sendMessage(message: String) {
var newMessage: LinearLayout = LinearLayout(context)
newMessage.style(R.style.hor_layout)
// <style name="hor_layout">
// <item name="android:layout_width">match_parent</item>
// <item name="android:layout_height">wrap_content</item>
// <item name="android:orientation">horizontal</item>
// </style>
var newMessageTxt: TextView = TextView(context)
newMessageTxt.style(R.style.message_text)
newMessageTxt.text = message
// <style name="message_text" parent="myText">
// <item name="android:layout_width">0dp</item>
// <item name="android:layout_height">wrap_content</item>
// <item name="android:layout_weight">0.85</item>
// <item name="android:layout_margin">#dimen/sec</item>
// <item name="android:padding">#dimen/sec</item>
// <item name="android:background">#color/gray_blue_medium</item>
// </style>
// message_text's parent
// <style name="myText">
// <item name="android:textColor">#color/gray_light</item>
// <item name="fontFamily">monospace</item>
// <item name="android:lineSpacingExtra">4sp</item>
// <item name="android:letterSpacing">0.1</item>
// <item name="android:textSize">#dimen/para</item>
// I've checked all my dimens are correct.
// </style>
// setting height by the lines below won't help either
// newMessageTxt.layoutParams.height = 500
// newMessageTxt.height = 500
println("orientation: ${newMessage.orientation.toString()}\n" +
"text size: ${newMessageTxt.textSize}\n" +
"text: ${newMessageTxt.text}\n" +
"height: ${newMessageTxt.height}\n" +
"width: ${newMessageTxt.width}")
// log-
// 2021-03-27 11:32:48.428 31468-31468/com.example.firechat3 I/System.out: orientation: 0
// 2021-03-27 11:32:48.428 31468-31468/com.example.firechat3 I/System.out: text size: 32.0
// 2021-03-27 11:32:48.428 31468-31468/com.example.firechat3 I/System.out: text: Why am I invisible??
// 2021-03-27 11:32:48.428 31468-31468/com.example.firechat3 I/System.out: height: 0
// 2021-03-27 11:32:48.428 31468-31468/com.example.firechat3 I/System.out: width: 0
var newMessageSpace: Space = Space(context)
newMessageSpace.style(R.style.message_space)
// <style name="message_space">
// <item name="android:layout_width">0dp</item>
// <item name="android:layout_height">match_parent</item>
// <item name="android:layout_weight">0.15</item>
// </style>
// adding the TextView and Space to the new LinearLayout
newMessage.addView(newMessageTxt)
newMessage.addView(newMessageSpace)
// adding the new LinearLayout to the parent
requireView().findViewById<LinearLayout>(R.id.messages_parent).addView(newMessage)
}
But the height and width of the newly added views remain 0 no matter how I try to do it and the orientation too whether I set it horizontal or vertical. I am using a package Paris by airbnb to set the style as told in this story on medium and I am using Paris because the solutions from this thread didn't helped me. The first message is added before runtime in the xml by hand and I want the other messages to look like that.
Create an xml file in layout folder named item.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="wrap_content"
android:orientation="horizontal">
<TextView
style="#style/message_text"
android:background="#color/gray_blue_medium"
android:text="#string/dummy_short" />
<Space style="#style/message_space" />
</LinearLayout>
your main xml will look like this
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginHorizontal="#dimen/para"
android:layout_weight="0.5"
android:background="#color/gray_medium_dark"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:id="#+id/messages_parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"/>
</ScrollView>
In onCreate() get reference to your linear layout
LinearLayout newMessage;
View view=null;
#Override
onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
newMessage = findViewById(R.id.messages_parent);
------
------
------
//Then on the click event (where you want to add item in your main container) Infalte item.xml as follows (this code is in java)
view = LayoutInflater.from(YourActivity.this).inflate(R.layout.item,newMessage,false);
TextVIew msgText = view.findViewById(R.id.message_text);
msgText.setText("some new message");
newMessage.addView(view);
}
Related
I am using native BottomNavigationView and I want to change selected icon size bigger than unselected icon sizes. (exp. selected icon 40dp, other icon sizes 20dp).
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_centerVertical="true"
android:scaleType="center"
style="#style/Widget.Design.BottomNavigationView"
app:labelVisibilityMode="unlabeled"
app:menu="#menu/navigation_menu" />
<item
android:id="#+id/homePageFragment"
android:icon="#drawable/selector_nav_home"
android:orderInCategory="1"
android:title="" />
<item
android:id="#+id/discoverPageFragment"
android:icon="#drawable/selector_nav_discover"
android:orderInCategory="2"
android:title="" />
<item
android:id="#+id/qrPageFragment"
android:icon="#drawable/selector_nav_qr"
android:orderInCategory="3"
android:title="" />
<item
android:id="#+id/myAccountFragment"
android:icon="#drawable/selector_nav_profile"
android:orderInCategory="4"
android:title="" />
<item android:drawable="#drawable/ic_bottom_navigation_profile" android:state_checked="true"/>
<item android:drawable="#drawable/ic_navigation_profile" android:state_checked="false"/>
You can change text size of selected item like this:
styles.xml:
<style name="bottomNavigationView.Active" parent="#style/TextAppearance.AppCompat.Caption">
<item name="android:textSize">16sp</item>
</style>
bottom_navigation_view.xml:
<?xml version="1.0" encoding="utf-8"?>
<com.google.android.material.bottomnavigation.BottomNavigationView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/bottomNavView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/windowBackground"
app:menu="#menu/bottom_nav_menu"
app:labelVisibilityMode="labeled"
app:itemIconSize="24dp"
android:scaleType="center"
app:itemTextAppearanceActive="#style/bottomNavigationView.Active" />
As a result of increased text size the selected item's icon lifts up and as a whole this looks like the selected element was increased in size:
like this
Try this to change the selected item icon size
override fun onNavigationItemSelected(item: MenuItem): Boolean {
changeItemIconSize(item.itemId)
return true
}
private fun changeItemIconSize(selectedItemId: Int) {
val displayMetrics = resources.displayMetrics
val menuView = bottomMenu.getChildAt(0) as BottomNavigationMenuView
bottomMenu.itemIconSize = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 24f, displayMetrics).toInt()
val iconViewSelected =
menuView.findViewById<View>(selectedItemId).findViewById<View>(com.google.android.material.R.id.icon)
val layoutParams = iconViewSelected.layoutParams
layoutParams.height =
TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 32f, displayMetrics).toInt()
layoutParams.width =
TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 32f, displayMetrics).toInt()
iconViewSelected.layoutParams = layoutParams
}
I am currently filling a TableLayout with data from external sources. After creating the TableRows and TextViews programmatically, their text color is set to white (seems to be the default).
I know that I can set the color by using myTextView.setTextColor(Color.BLACK);, but I am looking for a way to define the color in the XML layout file (I want to separate visuals from the logic). Does anyone know how to do this?
My layout (filled with example rows):
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:id="#+id/mytable"
android:stretchColumns="0,1,2"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
style="#style/AppTheme" >
<TableRow>
<TextView android:text="field1" />
<TextView android:text="field2" />
<TextView android:text="field3" />
</TableRow>
</TableLayout>
My java code:
public void updateTable() {
TableLayout table = (TableLayout) findViewById(R.id.mytable);
table.removeAllViewsInLayout();
TableRow row = new TableRow(getApplicationContext());
TextView text;
// Add Heading
text = new TextView(getApplicationContext());
text.setText("Head1");
text.setTextColor(this.textColor);
row.addView(text);
text = new TextView(getApplicationContext());
text.setText("Head2");
text.setTextColor(this.textColor);
row.addView(text);
text = new TextView(getApplicationContext());
text.setText("Head3");
text.setTextColor(this.textColor);
row.addView(text);
table.addView(row);
for(Data d : this.getData()) {
TableRow r = new TableRow(getApplicationContext());
TextView t1 = new TextView(getApplicationContext());
TextView t2 = new TextView(getApplicationContext());
TextView t3 = new TextView(getApplicationContext());
t1.setTextColor(this.textColor);
t2.setTextColor(this.textColor);
t3.setTextColor(this.textColor);
t1.setText(d.getData1());
t2.setText(d.getData2());
t3.setText(d.getData3());
r.addView(t1);
r.addView(t2);
r.addView(t3);
table.addView(r);
}
}
Create a styles.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="MyTheme" parent="android:Theme">
<item name="android:textViewStyle">#style/MyTextViewStyle</item>
</style>
<style name="MyTextViewStyle" parent="android:Widget.TextView">
<item name="android:textColor">#F00</item>
<item name="android:textStyle">bold</item>
</style>
</resources>
Then just apply that theme to your application in AndroidManifest.xml:
<application […] android:theme="#style/MyTheme">…
1.Create one table_item.xml file of TextView
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/text1"
android:text="#string/hello_world"
android:textStyle="bold"
android:textColor="#ff00ff"/>
2.Inflate table_item.xml
LayoutInflater inflater = LayoutInflater.from(getContext());
TextView text = (TextView)inflater.inflate(R.layout.table_item, this);
3.Add into TableLayout
r.addView(text);
table.addView(r);
If you want to do dynamically then after initializing mytable in java and then proceed as
for (int i = 0; i < mytable.getChildCount(); i++) {
View view = mytable.getChildAt(i);
if(view instanceof EditText)//
((EditText)view).setTextColor(Color.BLACK);
}
Create one common style in style.xml in values folder
<style name="WelcomeTextViewTitleStyle">
<item name="android:textSize">#dimen/welcome_textview_title_textsize</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:gravity">center</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">#color/white</item>
</style>
apply to in your textview
<TextView android:id="#+id/tv_title2"
style="#style/WelcomeTextViewTitleStyle"
android:text="#string/wantToKnow" />
try this code
<TextView android:text="assads"
android:textColor="#000000"/>
</TableRow>
I have created a custom action bar in my android app. Unfortunately the height and width is not set properly in my custom layout. After I run the app there remains a blank space left and right at the custom action bar as well as a heights problem. How can I solve this ?
Custom action bar
<?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="wrap_content"
android:background="#3A86CF"
android:orientation="horizontal"
android:layout_gravity="fill_horizontal">
<ImageView
android:id="#+id/imgLeftMenu"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="left|center_vertical|center_horizontal"
android:layout_weight="1"
android:src="#drawable/menu_left" />
<TextView
android:layout_width="200dp"
android:layout_height="30dp"
android:layout_weight="1"
android:id="#+id/txtTitle"
android:gravity="center_vertical|center_horizontal"
android:text="All Post"
android:textColor="#android:color/white" />
<ImageView
android:id="#+id/imgSearch"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#android:drawable/ic_menu_search" />
<ImageView
android:id="#+id/imgAdd"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#android:drawable/ic_menu_add" />
</LinearLayout>
Activity code
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.all_post);
CustomActionBar();
}
public void CustomActionBar()
{
android.support.v7.app.ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayOptions( android.support.v7.app.ActionBar.DISPLAY_SHOW_CUSTOM);
// Do any other config to the action bar
getSupportActionBar().setDisplayShowTitleEnabled(false);
getSupportActionBar().setDisplayShowHomeEnabled(false);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
// set custom view
View actionBarView = getLayoutInflater().inflate(
R.layout.custom_action_bar, null);
View btnMenuLeft= actionBarView.findViewById(R.id.imgLeftMenu);
btnMenuLeft.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
}
});
View textView_Title= actionBarView.findViewById(R.id.txtTitle);
View btnMenuShare= actionBarView.findViewById(R.id.imgSearch);
View btnMenuAdd= actionBarView.findViewById(R.id.imgAdd);
android.support.v7.app.ActionBar.LayoutParams params = new android.support.v7.app.ActionBar.LayoutParams(
android.support.v7.app.ActionBar.LayoutParams.MATCH_PARENT,android.support.v7.app.ActionBar.LayoutParams.MATCH_PARENT);
actionBar.setCustomView(actionBarView, params);
// Hide the home icon
actionBar.setIcon(android.R.color.transparent);
actionBar.setLogo(android.R.color.transparent);
}
style.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="android:height">5dp</item>
</style>
</resources>
put below code in your style.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="actionBarStyle">#style/MyActionBar</item>
<item name="android:actionBarStyle">#style/MyActionBar</item>
<!-- Customize your theme here. -->
</style>
<!-- ActionBar styles -->
<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="android:background">#color/actionbar_bg</item>
<item name="background">#color/actionbar_bg</item>
<item name="android:homeAsUpIndicator">#drawable/ic_backarrow</item>
<item name="homeAsUpIndicator">#drawable/ic_backarrow</item>
</style>
Use "#style/AppTheme" in manifest
Custom layout
<?xml version="1.0" encoding="utf-8"?>
<TextView
android:id="#+id/cal_tvActionbarTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="#color/white"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textStyle="bold" />
Write below code in your java class for actionbar
/**
* Method to change ActionBar Title
*/
public void setMainScreenActionBar(String p_title)
{
LayoutInflater m_inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
ActionBar m_actionBar = getSupportActionBar();
View m_viewActionBar = m_inflater.inflate(R.layout.custom_actionbar_title_layout, null);
ActionBar.LayoutParams m_params = new ActionBar.LayoutParams(ActionBar.LayoutParams.WRAP_CONTENT, ActionBar.LayoutParams.MATCH_PARENT, Gravity.CENTER);
TextView m_tvTitle = (TextView) m_viewActionBar.findViewById(R.id.cal_tvActionbarTitle);
m_tvTitle.setText(p_title);
m_actionBar.setCustomView(m_viewActionBar, m_params);
m_actionBar.setDisplayShowCustomEnabled(true);
m_actionBar.setDisplayShowTitleEnabled(false);
m_actionBar.setDisplayHomeAsUpEnabled(true);
m_actionBar.setHomeButtonEnabled(true);
}
put below code in your style.xml
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">Light">
<item name="actionBarStyle">#style/MyActionBar</item>
<item name="android:actionBarStyle">#style/MyActionBar</item>
<!-- Customize your theme here. -->
</style>
<!-- ActionBar styles -->
<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="android:layout_height">5dp<background">#color/actionbar_bg</item>
<item name="background">#color/actionbar_bg</item>
<item name="android:homeAsUpIndicator">#drawable/ic_backarrow</item>
<item name="homeAsUpIndicator">#drawable/ic_backarrow</item>
</style>
If you don´t fix Use "#style/AppTheme" in manifest
Custom layout
<?xml version="1.0" encoding="utf-8"?>
<TextView
android:id="#+id/cal_tvActionbarTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="#color/white"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textStyle="bold" />
Write belove code in your problem with this post a screenshot please. java class for actionbar
/**
* Method to change ActionBar Title
*/
public void setMainScreenActionBar(String p_title)
{
LayoutInflater m_inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
ActionBar m_actionBar = getSupportActionBar();
View m_viewActionBar = m_inflater.inflate(R.layout.custom_actionbar_title_layout, null);
ActionBar.LayoutParams m_params = new ActionBar.LayoutParams(ActionBar.LayoutParams.WRAP_CONTENT, ActionBar.LayoutParams.MATCH_PARENT, Gravity.CENTER);
TextView m_tvTitle = (TextView) m_viewActionBar.findViewById(R.id.cal_tvActionbarTitle);
m_tvTitle.setText(p_title);
m_actionBar.setCustomView(m_viewActionBar, m_params);
m_actionBar.setDisplayShowCustomEnabled(true);
m_actionBar.setDisplayShowTitleEnabled(false);
m_actionBar.setDisplayHomeAsUpEnabled(true);
m_actionBar.setHomeButtonEnabled(true);
}
I'm developing an Android application and I have a question about custom dialogs.
I do this to open a custom dialog:
protected void showSetFriendEmailDialog()
{
// Create the dialog.
final Dialog emailDialog =
new Dialog(FriendHomeActivity.this, android.R.style.Theme_DeviceDefault);
emailDialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
emailDialog.setCancelable(true);
emailDialog.setContentView(R.layout.dialog_add_friend_email);
// Get dialog widgets references.
final EditText editFriendsEmail = (EditText)emailDialog.findViewById(R.id.editEmailAddFriendEmail);
Button btnAccept = (Button)emailDialog.findViewById(R.id.btnAddFriendEmail);
// Set on click lister for accept button
btnAccept.setOnClickListener(new View.OnClickListener()
{
#Override
public void onClick(View view)
{
// Get selected values
String friendEmail =
editFriendsEmail.getText().toString();
// Close dialog.
emailDialog.dismiss();
// TODO: Call api to send email to web service using friendsEmail var.
Log.v(TAG, "Friend email: " + friendEmail);
}
});
//now that the dialog is set up, it's time to show it
emailDialog.show();
}
And this is its layout:
<?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:id="#+id/textAddFriendEmail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/layout_set_friend_email"
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/editEmailAddFriendEmail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="textEmailAddress" >
<requestFocus />
</EditText>
<Button
android:id="#+id/btnAddFriendEmail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/ok" />
</LinearLayout>
But it opens full screen.
What do I have to do to open it as an AlertDialog?
you have to use android.R.style.Theme.Dialog instenad of android.R.style.Theme_DeviceDefault
Use R.style.Theme_AppCompat_Dialog in order to get the proper dialog.
Just make a custom style and apply it to dialog...
<style name="full_screen_dialog" parent="#android:style/Theme.Dialog">
<item name="android:windowNoTitle">true</item>
<item name="android:windowFullscreen">true</item>
<item name="android:windowIsFloating">true</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowAnimationStyle">#android:style/Animation.Dialog</item>
<item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
<item name="android:windowBackground">#android:color/transparent</item>
</style>
Here is the action bar that I want to create.
Here is items that I put in menu.
<item
android:id="#+id/search"
android:title="Search"
android:showAsAction="ifRoom|collapseActionView"
android:actionLayout="#layout/search_layout"
/>
<item
android:id="#+id/search1"
android:title="PHOTO"
android:showAsAction="ifRoom"
android:actionLayout="#layout/search_layout"
/>
collapseActionView - collapses search menu on startup.
After click on search item it shows edit text like on picture 1. But I need always see it, not only after click.
If I set it to Always it will pop the menu items from the screen because of fill_parent.
<EditText
android:id="#+id/txt_search"
android:inputType="text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
Is it possible to get width of title bar layout without menu items? In this case I can set fixed width to edittext item.
Is it any other approaches to make it work?
In result it must be custom title layout + menu items. This custom layout must fill empty space between menu items and icon.
Using Custom ActionBar, you can solve your Problem. For Custom ActionBar you have to create on Custom Layout as per following:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:enabled="false"
android:orientation="horizontal"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:paddingEnd="8dip"
android:paddingRight="8dip"
android:paddingLeft="8dip">
<EditText
android:layout_width="200dip"
android:layout_height="wrap_content"
android:id="#+id/action_bar_edt_search"/>
<ImageButton
android:layout_width="50dip"
android:layout_height="50dip"
android:id="#+id/action_bar_img_search"
android:background="#drawable/search_ico"/>
<Button
android:id="#+id/action_bar_search"
android:layout_alignParentRight="true"
android:layout_gravity="right"
style="#style/ActionBarButtonWhite" />
<Button
android:id="#+id/action_bar_photo"
android:layout_alignParentRight="true"
android:layout_gravity="right"
style="#style/ActionBarButtonOffWhite" />
<Button
android:id="#+id/action_bar_video"
android:layout_alignParentRight="true"
android:layout_gravity="right"
style="#style/ActionBarButtonOffWhite" />
<Button
android:id="#+id/action_bar_mobile"
android:layout_alignParentRight="true"
android:layout_gravity="right"
style="#style/ActionBarButtonOffWhite" />
color.xml
<resources>
<color name="action_bar">#ff0d0d0d</color>
<color name="white">#ffffffff</color>
<color name="off_white">#99ffffff</color>
</resources>
styles.xml
<style name="MyActionButtonStyle" parent="android:Widget.ActionButton">
<item name="android:minWidth">28dip</item>
</style>
<style name="ActionBarButton">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:background">#null</item>
<item name="android:ellipsize">end</item>
<item name="android:singleLine">true</item>
<item name="android:textSize">#dimen/text_size_small</item>
</style>
now you need to create ViewGroup and ActionBar in your java file as per following:
final ViewGroup actionBarLayout = (ViewGroup) getLayoutInflater().inflate(
R.layout.actions,
null);
// Set up your ActionBar
final ActionBar actionBar = getActionBar();
actionBar.setDisplayShowHomeEnabled(false);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setCustomView(actionBarLayout);
// You customization
final int actionBarColor = getResources().getColor(R.color.action_bar);
actionBar.setBackgroundDrawable(new ColorDrawable(actionBarColor));
final EditText actionBarEditSearch = (EditText) findViewById(R.id.action_bar_edt_search);
actionBarEditSearch.setVisibility(View.GONE);
final ImageButton actionBarImgSearch = (ImageButton) findViewById(R.id.action_bar_img_search);
actionBarImgSearch.setVisibility(View.GONE);
final Button actionBarSearch = (Button) findViewById(R.id.action_bar_search);
actionBarSearch.setText("SEARCH");
final Button actionBarPhoto = (Button) findViewById(R.id.action_bar_photo);
actionBarPhoto.setText("PHOTO");
final Button actionBarVideo = (Button) findViewById(R.id.action_bar_video);
actionBarVideo.setText("VIDEO");
final Button actionBarMobile = (Button) findViewById(R.id.action_bar_mobile);
actionBarMobile.setText("MOBILE");
actionBarSearch.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
actionBarEditSearch.setVisibility(View.VISIBLE);
actionBarImgSearch.setVisibility(View.VISIBLE);
actionBarSearch.setVisibility(View.GONE);
}
});
actionBarImgSearch.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
actionBarEditSearch.setVisibility(View.GONE);
actionBarImgSearch.setVisibility(View.GONE);
actionBarSearch.setVisibility(View.VISIBLE);
}
});
<style name="ActionBarButtonWhite" parent="#style/ActionBarButton">
<item name="android:textColor">#color/white</item>
</style>
<style name="ActionBarButtonOffWhite" parent="#style/ActionBarButton">
<item name="android:textColor">#color/off_white</item>
</style>
You can achieve this by setting a custom view in place of the action bar title.
ActionBar actionBar = getActionBar();
actionBar.setCustomView(R.layout.search_layout);
actionBar.setDisplayShowCustomEnabled(true);
The result is an EditText that fills the entire width of the action bar, except for the action buttons. It looks exactly like the first image in the question.