Create a custom number picker - android

So because of the limited support library for the number picker (And because it's WAAY too big), I'm making my own number picker. Unfourtunately, it's not appearing correctly.
Any help on fixing it would be great.
Up arrow and down arrows occupy the same space (overlapping each other so that only the down arrow appears). The down arrow should be UNDER the text representing the number.
Any idea why this is?
Here's the screenshot:
And here's the code for it:
//"Number-Picker"
LinearLayout numPicker = new LinearLayout(context);
numPicker.setOrientation(LinearLayout.VERTICAL);
numPicker.setLayoutParams(pickerItemParams);
LinearLayout.LayoutParams upDownParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT, 1.0f);
//Up button
LinearLayout upSpace = new LinearLayout(context);
ImageView upArrow = new ImageView(context);
upArrow.setBackgroundResource(R.drawable.arrow_up);
upSpace.setLayoutParams(upDownParams);
upSpace.addView(upArrow);
//text
LinearLayout numSpace = new LinearLayout(context);
TextView pickerNum = new TextView(context);
pickerNum.setText(String.valueOf(textValue));
numSpace.setLayoutParams(upDownParams);
numSpace.addView(pickerNum);
//down
LinearLayout downSpace = new LinearLayout(context);
ImageView downArrow = new ImageView(context);
upArrow.setBackgroundResource(R.drawable.arrow_down);
downSpace.setLayoutParams(upDownParams);
downSpace.addView(downArrow);
numPicker.addView(upSpace);
numPicker.addView(numSpace);
numPicker.addView(downSpace);

//down
LinearLayout downSpace = new LinearLayout(context);
ImageView downArrow = new ImageView(context);
upArrow.setBackgroundResource(R.drawable.arrow_down); // <----- Should be downArrow
downSpace.setLayoutParams(upDownParams);
downSpace.addView(downArrow);
This might cause your downArrow to actually exist but its ImageView is missing its image.

Related

Center TextView on ImageButton Programmatically

I need to set TextView centered on a ImageButton, but using code. I can set a text on, but I can't center it.
code:
RelativeLayout rLayout = new RelativeLayout(this);
TextView textView = new TextView(this);
textView.setText("text");
textView.setTextSize(25);
textView.setGravity(Gravity.CENTER);
final ImageButton iButton = new ImageButton(this);
iButton.setImageResource(R.drawable.button);
iButton.setBackgroundColor(Color.TRANSPARENT);
rLayout.addView(iButton);
rLayout.addView(textView);
linear.addView(rLayout);
This code set text on imageButton, but set it in left-top.
It's kind of unclear what you're asking...but if I'm understanding correctly, you have to set the RelativeLayout.LayoutParams on the TextView before adding it to the parent. Also, you have to add the rule RelativeLayout.CENTER_IN_PARENT.
So, something like:
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(size, size)
params.addRule(RelativeLayout.CENTER_IN_PARENT)
textView.setLayoutParams(params)
Or some other combination of rules that fit your usecase.
so try
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.FILL_PARENT);
params.weight = 1.0f;
params.gravity = Gravity.CENTER;
iButton.setLayoutParams(params);

Adding a button to 2 LinearLayout?

I made a design for my app but as far as I can imagine
I have to a button into two different LinearLayouts.
Is it possible under Android?
Edit:
Code
_configureButton = new Button(context);
_callButton = new Button(context);
_messageButton = new Button(context);
_contactImage = new ImageView(context);
LinearLayout _verticalMainview = new LinearLayout(context);
LinearLayout _callAndMessageView = new LinearLayout(context);
LinearLayout _horizontelMainview = new LinearLayout(context);
LinearLayout _settingsAndMessageView = new LinearLayout(context);
//...
_callAndMessageView.addView(_callButton);
_callAndMessageView.addView(_messageButton);
_verticalMainview.addView(_configureButton);
_verticalMainview.addView(_contactImage);
_verticalMainview.addView(_callAndMessageView);
_horizontelMainview.addView(_contactImage);
_horizontelMainview.addView(_settingsAndMessageView);
_settingsAndMessageView.addView(_configureButton);
_settingsAndMessageView.addView(_messageButton);
Now code crashes. Or I should use GridLayout?
It isn't possible that a view has two parents.

Programmatically LinearLayout Weight

I'm trying to develop similar to grid but using LinearLayout. I would like to have 3 images and exact bottom text after images in single row.
What I have tried:
LinearLayout layout = new LinearLayout(context);
layout.setOrientation(LinearLayout.VERTICAL);
ImageView icon = new ImageView(context);
Item item = getItem(page, index);
Log.e("tag", item.getDrawable());
imageLoader.displayImage(item.getDrawable(), icon, R.drawable.ic_launcher);
icon.setPadding(15, 15, 15, 15);
layout.addView(icon);
TextView label = new TextView(context);
label.setTag("text");
label.setText(item.getName());
label.setTextColor(Color.BLACK);
label.setGravity(Gravity.TOP | Gravity.CENTER_HORIZONTAL);
label.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT));
layout.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
layout.setWeightSum(3f);
layout.addView(label);
I've a view method which returns Viewso I return return layout; at the end of the method.
Here I 've given weight 3 button this is not working for me. And code show more then 3 images in row with text but would like to have weight 3 images and bottom text .
LinearLayout.LayoutParams param = new LinearLayout.LayoutParams(
LayoutParams.MATCH_PARENT,
LayoutParams.MATCH_PARENT, 1.0f);
or
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
params.weight = 1.0f;
Button button = new Button(this);
button.setLayoutParams(params);
I would define a TableLayout with as many TableRows as you need. On each of those TableRows, I'd add a LinearLayout with VERTICAL orientation consisting of the two Views you need: ImageView and TextView.
This is the LinearLayout where you should set a weight of 1 (to all of them). You will have to get the screen's width and see whether the new LinearLayout to be added still fits the current row. If not, simply start a new TableRow.
To get the width of the screen you can use this:
final Display display = getWindowManager().getDefaultDisplay();
final Point size = new Point();
display.getSize(size);
final WindowManager.LayoutParams params = getWindow().getAttributes();
The screen's width might be accessed via the params.width attribute, just compare it with your LinearLayout's .getWidth() method and keep an incremental account (a float) of the current TableRow's width to help you determine if the current item should be placed in an existing row or a new one.
Programmtically setting Linear Layout weight
LinearLayout.LayoutParams param = new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT, 1.0f);

Adding images to one line in layout with ratio

I am doing an android app that have images which are located besides each other,
every image has its own width, I want to add these images in one line to fit the screen width,
with the same ratio for every one
I wrote code to add this images but still to know how to set the width programmatically
ImageView view = new ImageView(this);
view.setImageResource(R.drawable.a1);
ImageView view1 = new ImageView(this);
view1.setImageResource(R.drawable.a2);
ImageView view2 = new ImageView(this);
view2.setImageResource(R.drawable.a3);
LinearLayout my_root = (LinearLayout) findViewById(R.id.root_layout);
LinearLayout child = new LinearLayout(this);
child.setOrientation(LinearLayout.HORIZONTAL);
child.addView(view);
child.addView(view1);
child.addView(view2);
my_root.addView(child);
only image 1 and 2 appear but the third didn't appear because the width of screen finished
Any help !!
Thank you :)
You must need to use weight parameter to do this.
Try below code:
ImageView view = new ImageView(this);
view.setImageResource(R.drawable.a1);
view.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1f));
ImageView view1 = new ImageView(this);
view1.setImageResource(R.drawable.a2);
view1.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1f));
ImageView view2 = new ImageView(this);
view2.setImageResource(R.drawable.a3);
view2.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1f));
Use Layout Parameters to set height and Width of views at runtime.
like this
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(50, 50);
view .setLayoutParams(layoutParams);

Create multiple linear layout and divider programmatically

In my app. there is activity contain multiple linear layout and divider which created programmatically , its run fine ,
but i have to duplicate the linear layout and divider 5 times ,and all are the same except two things :
1- each linear layout has different string .
2- first divider margin differ than others divider margin .
is there's better approach to do that with more clean and shorter code .
any help will be much appreciated .
public class Dreams extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Boolean customTitleSupported =
requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
setContentView(R.layout.trip);
if (customTitleSupported) {
getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE,R.layout.custom_title);
}
TextView tv = (TextView) findViewById(R.id.title);
tv.setTypeface(FontFactory.getOldEnglish(getBaseContext()));
tv.setText("Dreams");
LinearLayout ll = (LinearLayout)findViewById(R.id.linearLayout);
// add text view
TextView tv1 = new TextView(this);
tv1.setGravity(Gravity.RIGHT);
tv1.setTextSize(30);
tv1.setTypeface(FontFactory.getOldEnglish(getBaseContext()));
ll.addView(tv1);
tv1.setText(Html.fromHtml(getString(R.string.dreams)));
ImageView divider1 = new ImageView(this);
LinearLayout.LayoutParams lp1 =
new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, 5);
lp1.setMargins(40, 0, 40, 0);
divider1.setLayoutParams(lp1);
divider1.setBackgroundColor(Color.RED);
ll.addView(divider1);
TextView tv2 = new TextView(this);
tv2.setGravity(Gravity.RIGHT);
tv2.setTextSize(30);
tv2.setTypeface(FontFactory.getOldEnglish(getBaseContext()));
ll.addView(tv2);
tv2.setText(Html.fromHtml(getString(R.string.dream_1)));
ImageView divider2 = new ImageView(this);
LinearLayout.LayoutParams lp2 =
new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, 5);
lp2.setMargins(10, 10, 10, 10);
divider2.setLayoutParams(lp2);
divider2.setBackgroundColor(Color.RED);
ll.addView(divider2);
TextView tv3 = new TextView(this);
tv3.setGravity(Gravity.RIGHT);
tv3.setTextSize(30);
tv3.setTypeface(FontFactory.getOldEnglish(getBaseContext()));
ll.addView(tv3);
tv3.setText(Html.fromHtml(getString(R.string.dream_2)));
ImageView divider3 = new ImageView(this);
LinearLayout.LayoutParams lp3 =
new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, 5);
lp3.setMargins(10, 10, 10, 10);
divider3.setLayoutParams(lp3);
divider3.setBackgroundColor(Color.RED);
ll.addView(divider3);
TextView tv4 = new TextView(this);
tv4.setGravity(Gravity.RIGHT);
tv4.setTextSize(30);
tv4.setTypeface(FontFactory.getOldEnglish(getBaseContext()));
ll.addView(tv4);
tv4.setText(Html.fromHtml(getString(R.string.dream_3)));
ImageView divider4 = new ImageView(this);
LinearLayout.LayoutParams lp4 =
new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, 5);
lp4.setMargins(10, 10, 10, 10);
divider4.setLayoutParams(lp4);
divider4.setBackgroundColor(Color.RED);
ll.addView(divider4);
TextView tv5 = new TextView(this);
tv5.setGravity(Gravity.RIGHT);
tv5.setTextSize(30);
tv5.setTypeface(FontFactory.getOldEnglish(getBaseContext()));
ll.addView(tv5);
tv5.setText(Html.fromHtml(getString(R.string.dream_4)));
ImageView divider5 = new ImageView(this);
LinearLayout.LayoutParams lp5 =
new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, 5);
lp5.setMargins(10, 10, 10, 10);
divider5.setLayoutParams(lp5);
divider5.setBackgroundColor(Color.RED);
ll.addView(divider5);
TextView tv6 = new TextView(this);
tv6.setGravity(Gravity.RIGHT);
tv6.setTextSize(30);
tv6.setTypeface(FontFactory.getOldEnglish(getBaseContext()));
ll.addView(tv6);
tv6.setText(Html.fromHtml(getString(R.string.dream_5)));
ImageView divider6 = new ImageView(this);
LinearLayout.LayoutParams lp6 =
new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, 5);
lp6.setMargins(10, 10, 10, 10);
divider6.setLayoutParams(lp6);
divider6.setBackgroundColor(Color.RED);
ll.addView(divider6);
}
}
Since all that is changing is the TextView setText() you can make this a for loop with a list of String inputs. For example:
LinearLayout ll = (LinearLayout)findViewById(R.id.linearLayout);
String[] textEntries = { getString(R.string.dream),
getString(R.string.dream_1),
getString(R.string.dream_2),
getString(R.string.dream_3),
getString(R.string.dream_4),
getString(R.string.dream_5)
};
for ( int i = 0; i < textEntries.length; i++)
{
TextView tv = new TextView(this);
tv.setGravity(Gravity.RIGHT);
tv.setTextSize(30);
tv.setTypeface(FontFactory.getOldEnglish(getBaseContext()));
ll.addView(tv);
tv.setText(Html.fromHtml(textEntries[i]));
ImageView divider = new ImageView(this);
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, 5);
lp.setMargins(10, 10, 10, 10);
divider.setLayoutParams(lp);
divider.setBackgroundColor(Color.RED);
ll.addView(divider);
}
first of all it would be easier if you define your layouts in XML instead of adding them programmatically. You will profit from the benefits of the UI editor as well. :)
Second, you may want to use ListView and an Adapter to fill the list, since you do not want do duplicate the same tasks for each layout.
Maybe these two links are helpful:
1. http://developer.android.com/guide/topics/ui/declaring-layout.html
2. http://developer.android.com/guide/topics/ui/layout/listview.html
So, to finally answer your question, I would do the following:
Create a file, e.g. list_item.xml, with something like:
<LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="10dp"><TextView your attributes.../></LinearLayout>
Create another layout, for instance main.xml, which contains a ListView. You can change the color of the divider like described here How to change the divider color in the listview?.
In your code (activity or fragment) add the main.xml as content view via setContentView().
Also in your code you should then add an adapter to the ListView which then populates the list for you. Here is an example How to customize listview using baseadapter
Finally, and since you separate the concerns (design and code), you could achieve what you want with just a few lines in your activity (the layout stuff would be in the xml and the population could be moved to a separated class like MyAdapter.java...)
Hope that helps...

Categories

Resources