How to make search widget larger in actionbar? - android

XML code here
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android">
<EditText android:id="#+id/find_text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:layout_marginLeft="5dip"
android:layout_marginRight="5dip"
android:contentDescription="#string/find_text"
android:background="#drawable/url_bar_entry"
android:singleLine="true"
android:textColor="#000000"
android:textCursorDrawable="#null"
android:inputType="text"
android:paddingLeft="15dip"
android:paddingRight="15dip"
android:textColorHighlight="#color/url_bar_text_highlight"
android:imeOptions="actionSearch"
android:selectAllOnFocus="true"
android:gravity="center_vertical|left"/>
<ImageButton android:id="#+id/find_prev"
style="#style/FindBar.ImageButton"
android:contentDescription="#string/find_prev"
android:src="#drawable/find_prev"/>
<ImageButton android:id="#+id/find_next"
style="#style/FindBar.ImageButton"
android:contentDescription="#string/find_next"
android:src="#drawable/find_next"/>
<ImageButton android:id="#+id/find_close"
style="#style/FindBar.ImageButton"
android:contentDescription="#string/find_close"
android:src="#drawable/find_close"/>
</RelativeLayout>
I am inflating this menu by using this:
LayoutInflater inflater = LayoutInflater.from(mContext);
View content = inflater.inflate(R.layout.find_in_page_content, null);
EditText tv = (EditText) content.findViewById(R.id.find_text);
ViewGroup.LayoutParams params = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.MATCH_PARENT);
tv.setLayoutParams(params);
//CODE TO ADD TO only EditText view to menu object I have
The outcome of this is seen here: http://imgur.com/sQZ7Lbh
My question is:, how can I make the url bar take up as much space as availble in the actiobar rather than be restricted to a tiny square. I also want the cursor to show up when pressed but it doesn't. However, I think that this is fixed when I make the url bar longer.

Set this gravity attribute in XML in your RelativeLayout
android:layout_gravity="fill_horizontal"
Taken from https://stackoverflow.com/a/12884297/2158970

Related

How to duplicate xaml code dynamically on button click [duplicate]

The main goal is to use a pre-made layout to create separate modules that can be edited, and then programmatically add them to the root layout. To clarify, several modules stuck together would look like this. I would like to dynamically create each clickable block that consists of a name, date, and letter. The .axml code for each block is as follows:
<RelativeLayout
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/borderLayout"
android:background="#drawable/line"
android:paddingBottom="1dp"
android:paddingTop="1dp">
<RelativeLayout
android:id="#+id/relativeLayout1"
android:padding="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:background="#ff2f2f2f">
<TextView
android:text="C"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView1"
android:layout_alignParentLeft="true"
android:textSize="30dp" />
<TextView
android:text="Washington"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/textView1"
android:id="#+id/textView2"
android:layout_alignParentRight="true"
android:gravity="right" />
<TextView
android:text="6-8-17"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textView2"
android:id="#+id/textView3"
android:gravity="right"
android:layout_alignParentRight="true" />
</RelativeLayout>
</RelativeLayout>
The main problem I am having is formatting the views programmatically in the same way that I formatted them in the .axml file.
Lets assume you have a LinearLayout with an orientation of vertical in your main axml that you wish to attach multiple views to.
Get a reference to that "parent" LinearLayout:
var linearLayoutParent = FindViewById<LinearLayout>(Resource.Id.linearLayout1);
Then in some loop, use LayoutInflater.Inflate to inflate your repeating layout, use the view returned and FindViewById on that View each of the elements you need to update and then add that view to the parent view with an increasing index:
index++;
var view = LayoutInflater.Inflate(Resource.Layout.RepeatingLayout, linearLayoutParent, false);
var letter = view.FindViewById<TextView>(Resource.Id.textView1);
letter.Text = index.ToString();
// FindViewById for textView2, textView3 and assign the text on each....
linearLayoutParent.AddView(view, index);
Note: If you have a lot of these repeating elements and you will have to scroll them (off screen), look at using a RecyclerView instead, it will save you a lot of headaches into terms of memory management, scrolling performance, etc... ;-)
Use inflater to create a view from resource. Then you can add it programmatically
context.LayoutInflater.Inflate(Resource.Layout.oneimg_twolbl, null);

Custom Listview weird UI glitch

I am struggling to debug a weird UI glitch for listviews in my android app. 99% of the time everything looks and works like it should, but every now and then my listviews behave strangely. When you restart the app the listview looks normal again.
Does anyone know if this is a known android bug?
The fact that it only happens at random (I have tried to figure out a pattern and cant) scares me. I havent been able to find anything online regarding similar issues. Hopefully I've just been googling the wrong search-terms.
Any advice/help would be much appreciated.
Thanks in advance.
What the Listview usually looks like:
What the listview looks like every now and then:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="#dimen/tile_height_padded"
android:descendantFocusability="blocksDescendants"
android:layout_margin="0dp"
android:padding="#dimen/padding_list">
<!--This is the clickable background of the item-->
<ImageView
android:id="#+id/imageview_poi_tile_detail_button_detail"
android:background="#color/ca"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="0dp"
android:layout_toLeftOf="#+id/imageview_poi_tile_map_button"/>
<!--This is the Grey vertical line next to the icon on the left-->
<ImageView
android:id="#+id/delimiter_poi_tile"
android:layout_width="#dimen/delimiter_size"
android:layout_height="#dimen/tile_description_height"
android:layout_marginTop="#dimen/margin_list_vertical"
android:layout_marginBottom="#dimen/margin_list_vertical"
android:background="#color/git"
android:layout_toRightOf="#id/imageview_poi_tile_icon"/>
<!--This is the red map button on the right-->
<ImageView
android:id="#id/imageview_poi_tile_map_button"
android:background="#color/lr"
android:src="#drawable/map"
android:scaleType="fitCenter"
android:padding="#dimen/image_button_padding"
android:layout_width="#dimen/button_size"
android:layout_height="match_parent"
android:layout_alignParentRight="true"/>
<!--This is the marker Icon on the left-->
<ImageView
android:id="#+id/imageview_poi_tile_icon"
android:src="#drawable/poidefaultgit"
android:scaleType="fitStart"
android:padding="#dimen/image_button_padding"
android:background="#color/ca"
android:layout_width="#dimen/button_size"
android:layout_height="#dimen/tile_description_height"
android:layout_margin="0dp"/>
<!--This is the bold title text, eg. BARONS-->
<TextView
android:id="#+id/textview_poi_tile_type"
android:background="#color/ca"
android:paddingLeft="#dimen/padding_list"
android:layout_margin="0dp"
android:gravity="left|top"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textStyle="bold"
android:text="Poi Type"
android:ellipsize="end"
android:maxLines="1"
android:textColor="#color/git"
android:layout_width="match_parent"
android:layout_height="#dimen/tile_title_height"
android:layout_toRightOf="#id/delimiter_poi_tile"
android:layout_toLeftOf="#+id/textview_poi_tile_distance"/>
<!--This is the address that is shown, eg 3 ADDERLEY ST, CAPE TOWN,-->
<TextView
android:id="#+id/textview_poi_tile_description"
android:background="#color/ca"
android:paddingLeft="#dimen/padding_list"
android:layout_margin="0dp"
android:gravity="left|top"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Address"
android:ellipsize="end"
android:maxLines="1"
android:textColor="#color/git"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/textview_poi_tile_type"
android:layout_toRightOf="#id/delimiter_poi_tile"
android:layout_toLeftOf="#id/imageview_poi_tile_map_button"/>
<!--This will display a string when the gps is on, not shown in image as gps was off in screenshot-->
<TextView
android:id="#id/textview_poi_tile_distance"
android:background="#color/ca"
android:textColor="#color/lr"
android:text=""
android:paddingRight="#dimen/padding_list"
android:layout_margin="0dp"
android:gravity="left|top"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/imageview_poi_tile_map_button"/>
#Override
public View getView(int position, View convertView, ViewGroup parent)
{
TextView description;
TextView type;
TextView distance;
ImageView imageView;
ImageView mapIcon;
ImageView clickableArea;
if(convertView == null)
{
convertView = LayoutInflater.from(context).inflate(R.layout.listitem_poi, parent, false);
description = (TextView) convertView.findViewById(R.id.textview_poi_tile_description);
type = (TextView) convertView.findViewById(R.id.textview_poi_tile_type);
distance = (TextView) convertView.findViewById(R.id.textview_poi_tile_distance);
imageView = (ImageView) convertView.findViewById(R.id.imageview_poi_tile_icon);
mapIcon = (ImageView) convertView.findViewById(R.id.imageview_poi_tile_map_button);
clickableArea = (ImageView) convertView.findViewById(R.id.imageview_poi_tile_detail_button_detail);
convertView.setTag(new ViewHolder(description, type, distance, imageView, mapIcon, clickableArea));
}
else
{
ViewHolder viewHolder = (ViewHolder) convertView.getTag();
description = viewHolder.description;
type = viewHolder.type;
distance = viewHolder.distance;
imageView = viewHolder.imageView;
mapIcon = viewHolder.mapIcon;
clickableArea = viewHolder.clickableArea;
}
final int finalIndex = position;
final PointOfInterest poi = getItem(position);
description.setText(poi.getDescription());
type.setText(poi.getName());
imageView.setImageResource(R.drawable.poidefaultgit);
distance.setText(poi.getDistance());
return convertView;
}
I think there are several things that are causing this. From experience, I've noticed RelativeLayout will sometimes not appropriately size it's children based on available space. It'll sooner let something get clipped if one of the sides of a child is not properly bounded somewhere. Also, I think some of the sizes for the TextViews just aren't enough to display the text. I did the following off the top of my head here so it may need some tweaking, however it should paint the picture of the layout to try. Unfortunately its not as flat as your current XML but it should hopefully fix your problem. Sorry not at a computer to test this currently.
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--This is the marker Icon on the left-->
<!--Use margin if you need more space to divider-->
<ImageView
android:id="#+id/imageview_poi_tile_icon"
android:src="#drawable/poidefaultgit"
android:scaleType="fitStart"
android:padding="#dimen/image_button_padding"
android:background="#color/ca"
android:layout_width="#dimen/button_size"
android:layout_height="match_parent"/>
<!--This is the Grey vertical line next to the icon on the left-->
<!--Use margin to determine how close the line is to the top/bottom of item-->
<ImageView
android:id="#+id/delimiter_poi_tile"
android:layout_width="#dimen/delimiter_size"
android:layout_height="match_parent"
android:layout_marginTop="#dimen/margin_list_vertical"
android:layout_marginBottom="#dimen/margin_list_vertical"
android:src="#color/git"
android:background="#color/ca"/>
<RelativeLayout
android:gravity="center_vertical"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:background="#color/ca">
<!--This is the bold title text, eg. BARONS-->
<TextView
android:id="#+id/textview_poi_tile_type"
android:paddingLeft="#dimen/padding_list"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textStyle="bold"
android:text="Poi Type"
android:ellipsize="end"
android:maxLines="1"
android:textColor="#color/git"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<!--This is the address that is shown, eg 3 ADDERLEY ST, CAPE TOWN,-->
<TextView
android:id="#+id/textview_poi_tile_description"
android:paddingLeft="#dimen/padding_list"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Address"
android:ellipsize="end"
android:maxLines="1"
android:textColor="#color/git"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textview_poi_tile_type"/>
<!--This will display a string when the gps is on, not shown in image as gps was off in screenshot-->
<TextView
android:id="#id/textview_poi_tile_distance"
android:textColor="#color/lr"
android:text=""
android:paddingRight="#dimen/padding_list"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/textview_poi_tile_type"/>
</RelativeLayout>
<!--This is the red map button on the right-->
<ImageButton
android:id="#id/imageview_poi_tile_map_button"
android:background="#color/lr"
android:src="#drawable/map"
android:scaleType="fitCenter"
android:padding="#dimen/image_button_padding"
android:layout_width="#dimen/button_size"
android:layout_height="match_parent"/>
</LinearLayout>
The idea here is to have the entire item in a LinearLayout that wraps to the size of the contents. Rely on it for getting everything horizontally in place. Then only wrap the TextViews in a Relativelayout. Just have the TextViews align beneath and to the side of each other. Have the RelativeLayout worry about actually centering them accordingly. It's weighted to ensure it stretches to fill any remaining space horizontally.
Also, your map button can be an ImageButton. You don't need a view solely to take the item click event. The root layout itself can do it as is. You probably ran into an issue with this setup. Check out this post which tells you how to properly get a row to click when an ImageButton is embedded.
Try inflating a new view every time instead of re-using them. I know it isn't the best thing to do, but at some point i had similar problems and this was the only thing that worked.
Thanks for the help. I managed to clean up the layout file a lot.
The reason that the UI glitch was happening is due to the wrong style file being loaded. It only happened when I loaded another element before that used that style. To solve it I created a new style specifically for the listviews and assigned it to the listview elements.

Using LayoutInflator to create a dialog that takes up whole screen

I am designing an "about" menu for an app and have used the following code in an options menu to generate it:
case DIALOG_ABOUT:
builder = new AlertDialog.Builder(this);
Context context = getApplicationContext();
LayoutInflater inflater = (LayoutInflater) context.getSystemService(LAYOUT_INFLATER_SERVICE);
View layout = inflater.inflate(R.layout.about_dialog, null);
builder.setView(layout);
TextView title = new TextView(this);
title.setText(R.string.about_title);
title.setGravity(Gravity.CENTER);
title.setTextSize(20);
builder.setCustomTitle(title);
builder.setPositiveButton("OK", null);
dialog = builder.create();
break;
I have created two different views for the about menu - for both horizontal and vertical viewings.
When displaying vertically, the about menu looks fine, but when displaying horizontally the bottom part of the text is being cut off. I am using the LayoutInflator and View controls without having that much knowledge about how they work, so I assume they are currently filling to some Android-specified size.
How can I create the dialog to take up the whole screen, or at least 90% of it?
Edit - My layouts looked like this:
Vertical Layout:
<ImageView
android:id="#+id/imageView1"
android:layout_width="120dp"
android:layout_height="120dp"
android:src="#drawable/icon" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="#string/game_name"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="#string/game_description"
android:textAppearance="?android:attr/textAppearanceMedium" />
Horizontal Layout:
<ImageView
android:id="#+id/imageView1"
android:layout_width="120dp"
android:layout_height="120dp"
android:src="#drawable/icon" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="#string/game_name"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="#string/game_description"
android:textAppearance="?android:attr/textAppearanceMedium" />
You may call the following on your dialog to fill entire space.
dialog.getWindow().setLayout(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);

Android: ActionBarSherlock Title Ellipsize

Is there a way to prevent the title of the ActionBar (sherlock) from getting cropped (like ThisIsMyTi...)
I'd like to always see the title in full length, so the title should always have the highest priority except the overflow menu button on devices without a hardware menu button.
Would be nice if there was a solution. Setting the ellipsize of the title to null doesn't work, it just gets cropped without the ...
Add on the top:
private TextView titleTV;
In your OnCreate:
ActionBar Bar=getSupportActionBar();
Bar.setDisplayShowTitleEnabled(false);
LayoutInflater inflater = LayoutInflater.from(this);
View customView = inflater.inflate(R.layout.bar, null);
titleTV = (TextView) customView.findViewById(R.id.title);
titleTV.setSelected(true);
Bar.setCustomView(customView);
Bar.setDisplayShowCustomEnabled(true);
And in bar.xml:
<?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="#android:color/transparent" >
<TextView
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="19dp"
android:singleLine="true"
android:duplicateParentState="true"
android:fadingEdge="horizontal"
android:ellipsize="marquee"
android:marqueeRepeatLimit="marquee_forever"
android:scrollHorizontally="true"
android:focusable="true"
android:focusableInTouchMode="true"
android:text="">
<requestFocus
android:duplicateParentState="true"
android:focusable="true"
android:focusableInTouchMode="true" />
</TextView>
</RelativeLayout>
You can set title with
titleTV.setText(t);

Dynamic TextViews wrapping to next row/line in Linear layout

I am trying to build a UI, where in I have a linear layout which has been defined in the XML.
As per the user's input, I need to add some TextViews to this linear layout. I am able to do this.
My actual problem is, when I have more text views, they are stacked next to each other and some of text views text are hidden or stretched vertically as shown in the image below.
I would like to use the whole width of the linear layout and if the text view can not fit in this row, it should be put in a new row or below the first text view.. I would like the display to be as below.
Following is my Linear layout configuration in XML:
<RelativeLayout
android:id="#+id/RL1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:paddingBottom="5dip"
android:paddingTop="5dip" >
<TextView
android:id="#+id/text1"
android:layout_width="85dip"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:gravity="left"
android:text="Lable 1"
android:textColor="#999999" />
<LinearLayout
android:id="#+id/LL1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/button1"
android:layout_toRightOf="#+id/text1"
android:gravity="left|center_vertical"
android:orientation="horizontal"
android:paddingLeft="5dip"
android:paddingRight="5dip"
android:paddingTop="3dip" >
</LinearLayout>
<Button
android:id="#+id/button1"
android:layout_width="30dip"
android:layout_height="30dip"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginTop="2dip"
android:background="#drawable/plus"
android:clickable="true"
android:focusable="true"
android:paddingTop="5dip" />
</RelativeLayout>
Can any one please help me in how to realign the same in java code.
I would Like to suggest you about how you can provide equal sizes to all your views in Linear Layout,you can do that by using weight property in the XML file i.e., android:weight for that particular View and when you use this property you should give width=0dp or 0dip.I think this will solve your problem easily.
Please I suggest you first you take full Knowledge of how to use this property in the following Link:-Weight property with an example
Please see:
How to wrap Image buttons in a horizontal linear layout?
How can I do something like a FlowLayout in Android?
You also might search github for FlowLayout.java.
An alternative approach is given in:
Android - multi-line linear layout
In addition, there's a class that adds images into a TextView:
https://stackoverflow.com/a/21250752/755804
which is not the same as wrapping views in the general case, but sometimes may do the job.
i'm korean.
so i don't speak English well, but i'll help you.
first, Create 'item.xml' with four text boxes.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/set_checkbox"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/text2"
android:text="0"
android:layout_weight="1"
android:gravity="center"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/text3"
android:text="0"
android:layout_weight="4"
android:gravity="center"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/text4"
android:text="0"
android:layout_weight="4"
android:gravity="center"/>
</LinearLayout>
second, Create 'main.xml' where 'item.xml' will be dynamically generated.
'orientation' helps to create one line at a time.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
</LinearLayout>
Finally, You can create four TextView per line using the code below.
LinearLayout layout = (LinearLayout)findViewById(R.id.mainxml);
LinearLayout item = (LinearLayout)layout.inflate(this.getContext(), R.layout.itemxml, null);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(MATCH_PARENT, WRAP_CONTENT);
item.setLayoutParams(params);
CheckBox cb = item.findViewById(R.id.set_checkbox);
TextView text2 = item.findViewById(R.id.text2);
TextView text3 = item.findViewById(R.id.text3);
TextView text4 = item.findViewById(R.id.text4);
cb.setChecked(true);
text2.setText("text2");
text3.setText("text3");
text4.setText("text3");
layout.addView(item);
The 10th loop is shown in the following picture.
enter image description here

Categories

Resources