I'm trying to design the dialog xml file. It's a bit hard to follow the Material Design guidelines. Basically I want the dialog window to allow users to multi-check the checkboxes and on the bottom to have an option to add custom option (one EditText). For example:
Choose the options
[x] Option1
[] Option2
[x] Option3
[] Option4
Add custom options:
__________
[Cancel] [Ok]
The code I have:
public void onClick(View view) {
AlertDialog.Builder mBuilder = new AlertDialog.Builder(AddData.this);
View mView = getLayoutInflater().inflate(R.layout.dialog_adding_data,null);
// More code here
mBuilder.show();
}
As I understand I'm using a custom dialog layout. But in the material design guidelines I didn't see an option to do something like that. Also I'm not sure how to to design the dialog_adding_data file. How can I design the dialog_adding_data so it will follow the material design guidelines and have the same functionality?
To achieve your UI requirements, you need to set a custom view to your dialog. The key point here is to use the following:
mBuilder.setView(mView);
If you are not using view/data binding, when referencing the views, make sure to use mView.findViewById and not findViewById like the following:
EditText editText = mView.findViewById(R.id.edit_text);
// Add your code logic, etc.
Concerning dialog_adding_data.xml that you have created, it will simply be like any other layout. Its hierarchy, depending on your exact needs, may look something like this:
<ScrollView>
<LinearLayout>
<CheckBox />
<CheckBox />
<!-- This one controls the EditText below. -->
<CheckBox android:text="Add custom options" />
<EditText />
</LinearLayout>
</ScrollView>
If the check boxes count are dynamic, then you might need to use a RecyclerView with 2 view types (one for a normal option, and the other for the custom options) instead.
Related
I have 1 Class that are opened two different ways. One way is it's opened from a sliding drawer and another way is as a dialog. Below you can see both of them. However, you can see that the edittext does not look the same in both. How can I modify the dialog style to look like the fragment?
Here is how it is made:
final EditText editTextView = new EditText(a);
editTextView.setHint(R.string.hintNote);
editTextView.setTag(tag); editTextView.setId(_id);
You can add the style attribute to the layout XML. They will both then use the style specified:
style="#android:style/Widget.EditText"
I have a popup which is shown when I receive a GCM notification. The popup is implemented as a LinearLayout which is setContentView'd in the popup activity. The layout render in Android Studio looks like this:
However, on the device and on the DebugMonitor View Hierarchy dump it does not show, although it is there:
The TextView has the default text "Where?" replaced in the extended Activity class:
String lightName = getIntent().getStringExtra(LIGHT_NAME_KEY);
final TextView lightNameLabel = (TextView) findViewById(R.id.lightNameLabel);
lightNameLabel.setText(lightName);
I am at a loss here. I grep'ed through the project files and there are no other uses of the TextView's id other than in the snippet above. Could you please give me some pointers where to investigate why the TextView doesn't show?
[edit] I am including the .xml snippet for the respective TextView:
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/lightNameLabel"
android:layout_gravity="center_horizontal"
android:layout_marginTop="1dp"
android:text="Where?"
android:visibility="visible" />
[edit 2] A link to the whole layout .xml file: http://pastebin.com/2uqkzBSa
It was helpful that you showed a screenshot, as the problem is likely that you're displaying the layout in a dialog. If you select the Holo dialog theme in Android Studio's graphical editor pane, you'll observe that the default text color is white. Since you've provided a light background, the light text is simply illegible against it.
There are different solutions:
Provide a different theme when displaying the dialog as to ensure that the primary colors are dark; or
Define your own theme and provide it when displaying the dialog; or
Modify the layout to specify a text color.
I have a styled TextView whose real text is populated dynamically at runtime. The Graphical Layout view is very useful for getting a feel on how this component works with others in terms of look and feel, etc. There is no sensible default to this text field and I wish it to be blank before being populated. If I don't specify any text in the TextView declaration then the TextView is blank. I can set the text manually using:
<TextView
...
android:text="Preview text"/>
and then switch to the Graphical Layout. However, I must remember to remove this or risk it being shipped in my production version.
Is there a way to specify text which is only seen in the Graphical Layout preview but not applicable at runtime?
EDIT: I'm using Eclipse ADT.
Yes you can with the design tools extension attributes in Android Studio.
See this page https://developer.android.com/studio/write/tool-attributes.html
Basically you define the tools namespace
xmlns:tools="http://schemas.android.com/tools"
Then use it to set your placeholder text.
<EditText
tools:text="John Doe"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
This actually works with most (if not all xml attributes).
e.g
tools:visibility="gone"
would set the preview visibility to "gone" but the runtime visibility would be unchanged.
I don't believe there is, the only possible way is when you declare your TextView, you say after, tv.setText(""); this way you will always find it blank at runtime
The Android design documentation in http://developer.android.com/design/building-blocks/dialogs.html makes a clear differentiation between Dialogs, Alerts, Popups and Toasts. It also recommends the implementation of Dialogs by means of the DialogFragment class and Toasts by means of the Toast class. However it's not clear to me whether Popups should be implemented with PopupWindow or with DialogFragment.
I know that DialogFragments usually come with Ok/Cancel buttons and that the location of PopupWindows can be defined, but:
Are these slight differences the only arguments to use one or the other?
Is DialogFragment the successor of PopupWindow that will be deprecated at some point?
According to the answer in https://stackoverflow.com/a/15165554/2482894, PopupWindow is "Limited to a few templates", but I can't find any reference to a limited amount of templates in the class documentation.
So, finally, how would you implement Popups like these http://developer.android.com/design/media/dialogs_popups_example.png and why?
If you want dialog as shown in the link, just make them by making custom dialog as mentioned below:
Make a dialog object:
Dialog dialog = new Dialog(context,android.R.style.Theme_Translucent_NoTitleBar);
Set custom view to this dialog:
show_dialog(){
dialog.setContentView(R.layout.custom_dialog);//your custom dialog layout.
}
Your custom layout should be like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:id="#+id/custom_dialog_first_rl"
android:background="#android:color/black">
<!-- write code for rest of your UI here -->
</RelativeLayout>
Now set alpha for your first relative layout in show_dialog() like this:
show_dialog(){
dialog.setContentView(R.layout.custom_dialog);//your custom dialog layout.
RelativeLayout custom_dialog_first_rl=(RelativeLayout)dialog.findViewById(R.id.custom_dialog_first_rl);
custom_dialog_first_rl.getBackground().setAlpha(170);
}
Call show_dialog() where you wanna show this dialog
I am trying to create a custom title bar strictly for Android 2.1 that somewhat emulates the ActionBar found in Android 3.0 and up.
So far I've had fairly decent luck, but I cannot find an easy way to make the drop-down lists that can appear below the icon / buttons in the ActionBar.
I would like these drop-down lists to be able to cross the boundary between the title layout and the content layout without being clipped / cut off. I would also like the drop-down lists to be positioned relatively below the icons / buttons in the ActionBar. I've seen advice to use FrameLayouts and RelativeLayouts already but these did not seem to solve my particular problem (unless I'm looking at it wrong). I keep thinking it must be possible since I believe the newer versions of Android have support for exactly this type of behavior.
Here is a screenshot of what I am trying to accomplish with some notes.
http://img217.imageshack.us/img217/3279/67343249.png
Please help. Thanks!!!
I think best way to do that is to create a linear layout and add your drop-down list item into that linear layout. Then add linear layout on button click and display it just below to the button by using relative layout layoutparams.
You need to hold your content with a FrameLayout. A FrameLayout can hold more than one child, and it will allow them to overlap on each other.
A possible layout xml could look like:
<FrameLayout>
<LinearLayout android:margin_top="30dip">...</LinearLayout>
<CustomActionBar />
</FrameLayout>
The 30dip is just the height of your ActionBar, you might want to define it in values. And the LienarLayout you can replace with anything which is just for holding the other content in your application.
PS. I am not sure if FrameLayout renders first child first or last. In case you found the linearlayout stuff overlaps the customactionbar, swap their position.
=== Edit ===
To make the code much cleaner, one can do in this way:
<CustomActionBar>
<LinearLayout/>
</CustomActionBar>
Which replaced the custom action bar to be the "root" element of any xml layout that utilized the action bar. When doing the custom action bar, you need to extend it from FrameLayout, and assign the child's margin accordingly. Which the idea is much the same as the one I presented above.
After a few days of research I found the best way to implement this is to use a custom dialog box with a custom theme that contains a listView. When the user clicks on the button the dialog should be displayed directly below the button. This provides a good user experience and also means you don't have to completely change your basic layout structure to accomodate this functionality. (This is basically the same approach that ActionBar Sherlocke uses for their backwards compatibility menus)
Here is a code snippet of what I'm describing (this is written in C# using Mono for Android but it should be easy to translate to Java):
Dialog dlgHome = new Dialog(this, Resource.Style.ActionBarMenu);
dlgHome.SetCanceledOnTouchOutside(true);
dlgHome.SetContentView(Resource.Layout.ActionBarMenu);
ListView lsvHome = (ListView)dlgHome.FindViewById(Resource.Id.lsvHome);
lsvHome.Adapter = new ArrayAdapter<string>(this, Resource.Layout.ActionBarMenuItem, new string[] { "Add Activity", "Edit Log", "Program Details" });
Rect r = new Rect();
btnHome.GetLocalVisibleRect(r);
int x = r.Left + (int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 5, Resources.DisplayMetrics);
int y = r.Bottom;
WindowManagerLayoutParams param = dlgHome.Window.Attributes;
param.Gravity = (int)(GravityFlags.Top | GravityFlags.Left);
param.X = x;
param.Y = y;
dlgHome.Window.Attributes = param;
Also, here is the style xml (goes in style.xml)
<style name="ActionBarMenu" parent="android:Theme.Dialog">
<item name="android:windowBackground">#color/actionbar_menu_bg</item>
<item name="android:windowNoTitle">true</item>
<item name="android:backgroundDimEnabled">false</item>
</style>