I need to dynamically add text to a linear layout in an Android PdfDocument that I generate from a layout.xml file. The header is consistent and therefore placed in the layout. However, the data that follows comes from a few dynamically populated lists. I need to add this data using the Android PdfDocument library (no third party solutions please).
I have been able to create the Pdf and save it to external storage. I can changed the text of items defined in the layout.xml. I just can't add anything to the layout.xml dynamically.
My code is long and scattered over a few class as the PdfDocument is populated by a custom ReportBuilder object. So I will simply list the steps I take and show the relevant portion of my code.
This works:
1. Get layout and inflate it.
2. Create PdfDocument object.page object.
3. Set page width and height.
4. Get canvas.
...
// Get the canvas we need to draw on.
Canvas canvas = page.getCanvas();
// Set report title, text field already exists in report_layout.xml
// So this works
setPageTitle("Report Title");
// Adding dynamically generated content does not work here...
TextView text = new TextView(mContext);
text.setTextColor(BLACK);
text.setText("Testing if I can add text to linear layout report_container");
text.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT));
// The report container is an empty LinearLayout
// present in report_layout.xml
LinearLayout cont = mReportLayout.findViewById(R.id.report_container);
((LinearLayout)cont).addView(text);
// Draw the view into the pdf document
mReportLayout.draw(canvas);
// Finalize the page.
mDocument.finishPage(page);
// Return document, calling party will save it.
return mDocument;
...
As stated, anything that is already contained in the report_layout.xml file can have it's properties changed and is contained in the final pdf. However, the TextView I create and try to add is never visible. I have made sure text color is correct, I get no errors, I have tried placing images as well and that does not work either. What am I missing?
The problem is your linearlayout still has a width and height of zero.
Try to add:
//add this before mReportLayout.draw(canvas)
int measuredWidth = View.MeasureSpec.makeMeasureSpec(page.getCanvas().getWidth(), View.MeasureSpec.EXACTLY);
int measuredHeight = View.MeasureSpec.makeMeasureSpec(page.getCanvas().getHeight(), View.MeasureSpec.EXACTLY);
mReportLayout.measure(measuredWidth, measuredHeight);
mReportLayout.layout(0, 0, measureWidth, measuredHeight);
Also take a look at this answer.
Related
I'm trying to make simple program that allows to "load" an .xml file and display it as the View in setContentView of a new activity. Basically, what I would like is that the view of the new activity would be the same as if I called
setContentView(R.layout.my_view)
where R.layout.my_view would be that xml file. But in my case, that file doesn't yet exist at compilation time, and should be loaded dynamically (e.g., from storage).
I guess I could parse my .xml file and build the view dynamically by code, but that feels like reinventing the wheel and it's also most likely that the views won't be identical. I thought there should be some easy way to do this, but all the methods I found so far from similar questions (e.g.,
getResources().getXml(R.layout.my_view);
//or
LayoutInflater.from(context).inflate(R.layout.my_view, null) )
seem to require the file already in compilation time. Is there something I'm missing?
well, its not possible to load XML from server and parse it like usual layout XML. from LatourInflater doc:
Important For performance reasons, view inflation relies heavily on pre-processing of XML files that is done at build time. Therefore, it is not currently possible to use LayoutInflater with an XmlPullParser over a plain XML file at runtime.
and it isn't related to generating IDs or similar mechanism, just performance - so consider that you really need this feature, it is kind of blocked for a reason ;)
but if you still really want to load layout from third party you can use json2view lib. good luck!
It is impossible as you describe. But you can do it by Java code.
When we create a layout xml file under layout resource folder and give some id using android:id="#+id/textview" IDE generate an ID R.java file that hold all IDs we assign.
When we call that view from Activity or Fragment we create an Object using that ID like
TextView textview = (TextView) findViewById(R.id.textview);
and user that.
If you want to load xml code form storage or server as a plan text in xml format. You will assign some ID for your views. But IDE won't generate any ID for that. So you can not create object of them.
So solution is you have to generate view by Java code that means programmatically.
setContentView(R.layout.activity_main);
Display display = getWindowManager().getDefaultDisplay();
int width = display.getWidth();
width = width - (100/width)*80;
LinearLayout layout = (LinearLayout) findViewById(R.id.lo_dynamic_view_container);
LinearLayout.LayoutParams lparams = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
TextView tv = new TextView(this);
tv.setLayoutParams(lparams);
tv.setWidth(width);
float redious [] = { 0, 0, 8.3f, 8.5f, 8.2f, 8.9f, 0, 0 };
ShapeDrawable shape = new ShapeDrawable (new RoundRectShape(redious,null,null));
shape.getPaint().setColor(Color.GREEN);
tv.setBackground(shape);
layout.addView(tv);
Here activity_main.xml will have only one empty LinearLayout layout. You can generate view according to your condition or instruction document form storage or server and add them to LinearLayout.
I get the list of elements from the HTTP response, then I want to dynamically insert that list into the textview inside the "box" that you can see, currently it just inserts a string and overlaps them one over the other. I tried changing the layout (all three constraint, relative and linear) and it didn't help. Does anyone know how to position them dynamicly inside the boxes and not overlap but have margins like in the second picture? Otherwise, inside the project, I use a constrain layout.
Here is my code:
RelativeLayout parentLayout = (RelativeLayout) findViewById(R.id.layout);
int size = response.toArray().length;
final TextView[] tv = new TextView[size];
TextView temp;
for (int i = 0; i < size; i++)
{
temp = new TextView(Activity.this);
temp.setText(response.get(i).getName());
parentLayout.addView(temp);
tv[i] = temp;
}
Here is the picture how it looks right now:
And here is the picture how I want it to looks like:
This sounds like a typical ListView use case.
Firstly, I'd suggest you go through the documentation -
https://developer.android.com/reference/android/widget/ListView
You can see an implementation example of a list view with an array of strings here -
https://androidexample.com/Create_A_Simple_Listview_-_Android_Example/index.php?view=article_discription&aid=65
In general, you choose the UI of your item and the listView populates the view to each item in your list (each string in your case).
In the adapter, you give each item the data it needs for the UI.
I would suggest you to use RecyclerView for this type of task. You may use ListView as well.
But RecyclerView is more flexible and advanced than ListView.
Create a simple layout or xml file for your row item to be shown in RecyclerView.
Add that row xml file in onCreateViewHolder method. And inside method onBindViewHolder do necessary task like for example, showing name in the list for each position.
Go to this link for your reference : https://developer.android.com/guide/topics/ui/layout/recyclerview
Instead of Array<String> you can use Array<CustomModel> as well depending on your requirement.
Simple example of RecyclerView with model objects as list : https://www.javatpoint.com/android-recyclerview-list-example
Well, the proper way to do what you need is use ListView or RecyclerView.
Anyway, if you want to use your current solution, you need to specify the position of each TextView.
For example, assign an ID to each textview you create and then set the position of it under the previous one. Here you can find how to do that.
I have a frame-layout defined in xml a follows:
//pseudo code
<FrameLayout
android:height = "match_parent" // same for width
android:background="#android:color/white"
padding = "20dp"
id = "polygraph"
layout_gravity="center"/>
I access this xml view via code as such:
LayoutInflater inflater = this.getLayoutInflater();
frameInflate = (FrameLayout) inflater.inflate(R.layout.mframe,null);
frar = (FrameLayout)frameInflate.findViewById(R.id.polygraph);
I create the following image-view dynamically but somehow it doesn't show inside this frame-layout which is one of many views inside another frame-layout that holds all the views of my User-Interface
view1 = new ImageView(this);
view1.setAdjustViewBounds(false);
matrix = new Matrix();
view1.setScaleType(ImageView.ScaleType.Matrix);//I have tried: ScaleType.Center it did not work at all
view1.setImageMatrix(matrix);
view1.setBackgroundColor(Color.GRAY);
params11= new FrameLayout.LayoutParams(200,300,Gravity.CENTER);
view1.setLayoutParams(params11);
DummyDraw drawD = new DummyDraw(this);
view1.setImageDrawable(drawD);
frar.addView(view1);
//somewhere down on onWindowsFocusChange()
frar.invalidate(); //try to invalidate to see if it will show the imageview
No image-view shows at all. I have tried different ways, such as:
frar.addView(view1,params11); //did not work
//instead of view1.setImageDrawable
view1.setBackground(drawD); //nothing
view1.setImageResource(R.drawable.somerandomdrawable);//nothing
I have no idea why this view isn't showing. Could it be the drawable "drawD"? If it is this drawable, then why isn't showing at least the background color "gray"
which I set in the code? I have tried to get rid of the ScaleType.Matrix to something else, such as ScaleType.Center, but nothing seems to work.
Any advice or suggestions will be appreciated
thanks
I had ran into the same problem a few months ago. But I did forget how to handle it. LayoutInflater wasn't needed to solve the problem. Seems like I can't do this call inside onCreate() "(FrameLayout)findViewById(R.id.polygraph)" and then try to add my programmatically created image-view to my xml layout element. It gave me a null pointer exception all the time.
Moving both calls way after the layout pass, such as on onStart() or onWindowsFocusChanged() works well. The image-view is added to the xml frame-layout, which in the end it works well for my app, since I had the intentions of adding the image-view well beyond the layout pass.
I want to create this sort of a view where the cross should be separate image view as I want it to be clickable. How can I achieve this ?
It would be great If I can create this view programatically as I am a dynamic list of images and I am programatically creating the image Views. All I need now is to add the overlapping imageview as well.
Thanks in advance
Use FrameLayout and you can overlay views on top of each other
Ex:
FrameLayout frame = (FrameLayout) findViewById(R.id.frame);
ImageView image = new ImageView(this);
iv.setImageResource(R.drawable.image);
ImageView cross = new ImageView(this);
i.setImageResource(R.drawable.cross);
FrameLayout.LayoutParams layoutParams = new FrameLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
layoutParams.gravity = Gravity.RIGHT | Gravity.TOP;
i.setLayoutParams(layoutParams);
frame.addView(image);
frame.addView(cross);
Create a RelativeLayout programmatically, which contains two ImageViews. Place your image in the first one, and your second image in the second one. Adjust the margins accordingly to place it in the top right corner.
First create a completely new layout to use as an placeholder for example "partial_layout.xml". Then in your code first make a LayoutInflater with something like this:
LayoutInflater mInflater = (LayoutInflater) this.getSystemService(this.LAYOUT_INFLATER_SERVICE);
then try to get a fresh copy of this layout with something like this:
View convertView = mInflater.inflate(R.layout.partial_layout, null);
now put your current data to this view, and finally add this view to your content view.
If you create a list of views, you can still use XML by inflating it only when needed - just watch the lecture "the world of listView" in order to do it correctly. Using ListView is much more efficient than creating as many views as the number of items to show (for example, if there are 100 images to show, only those that are on screen need to be created).
Anyway, the xml can contain either FrameLayout or RelativeLayout as the root view, and you just put the 2 imageViews according to the right position you wish to have. You can use the UI designer for this, or edit the XML itself by adding margin-top for the larger image. also, make sure the larger image is written there before the small one.
as for the clicking, you can use setOnClickListener on the small imaveView.
BTW, if it's just images, you should probably use GridView instead of ListView.
I am having a little bit of trouble making the table look like I intend to.
These are a few questions, but since they all refer to the picture below and the details I provide I thought they should all be in a single post.
Here is what I achieved so far:
The header row contains one element of type Button.
TableRow.LayoutParams params = new TableRow.LayoutParams(TableRow.LayoutParams.MATCH_PARENT, TableRow.LayoutParams.WRAP_CONTENT);
Button bt = new Button(getContext());
bt.setText("Column1");
mHeader.addView(bt, params);
mHeader.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT));
addView(mHeader);
The rest of the table is poulated like this:
(Messagerow extends TableRow and has a TextView member)
for(int i = 0; i < 100; i++) {
MessageRow mr = new MessageRow(getContext());
// stuff to set the TexView text and color
mr.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT));
this.addView(mr);
}
1. How can I make the header row height be more like the rows?
2. How can I make the button occupy the full width of the row?
If the table is empty, no text rows just header, then the button matches the row width. As soon as I add a row of text, the column width is adapted but the button width is not.
3. How can I make the row fill the screen width? (MATCH_PARENT does not do it)
4. How can I draw a thin line between the table rows?
I tried to override the onDraw() function on MessageRow, but it never gets called, not even once.
Don't get me wrong. I am not asking that you do my work for me. These are issues I tried to solve by myself and googled them and read similar posts, but did not find an answer.Note: I find that UI design in Javascript for Android lacks clear control and clear documentation over all these little details.
Edit
This is how I create the table:
TableLayout mTable = new TableLayout(this);
HorizontalScrollView hview = (HorizontalScrollView) findViewById(R.id.hscroll);
populate(mTable);
mTable.setLayoutParams(new TableLayout.LayoutParams( TableLayout.LayoutParams.MATCH_PARENT, TableLayout.LayoutParams.WRAP_CONTENT));
mTable.setBackgroundColor(Color.WHITE);
hview.addView(mTable);
How can I make the header row height be more like the rows?
Using the default Button there isn't much to do. The Button uses a nine-patch image that has some space between the button's text and the borders that you see. You could use a smaller font but that you'll probably look ugly. Another thing to try is using your own background for the Button and get rid of the default extra space(of the default nine-patch image) so the final height is near the height of the text from the TextViews. Or try to enforce a standard height for all rows using a fixed value.
How can I make the button occupy the full width of the row?
I think that you have more then one TextView in MessageRow so when you add the Button it moves to the first column(corresponding to the first TextView). If this is the case, make your Button span across the number of columns representing the number of TextViews in MessageRow:
TableRow.LayoutParams params = new TableRow.LayoutParams(TableRow.LayoutParams.MATCH_PARENT, TableRow.LayoutParams.WRAP_CONTENT);
params.span = 3; // if you have 3 `TextView` in the MessageRow
Button bt = new Button(getContext());
bt.setText("Column1");
mHeader.addView(bt, params);
If this is not the case add more details.
How can I make the row fill the screen width? (MATCH_PARENT does not do it)
As I said on one of your previous questions, I don't know why that happens(but I gave you some solutions there to overcome this issue). Also:
mHeader and the other MessageRow are children of a Tablelayout and the correct LayoutParams to use on them is the LayoutParams of the parent: TableLayout.LayoutParams and not TableRow.LayoutParams.
You add some TextView in the MessageRow(from what I seen in your previous questions), add those child views with TableRow.LayoutParams to MessageRow.
You use only WRAP_CONTENT for your LayoutParams everywhere in your code, you might want to set the width(the first parameter in the constructor) to FILL_PARENT/MATCH_PARENT
How can I draw a thin line between the table rows?
You could use a simple View that will act as a separator:
for(int i = 0; i < 100; i++) {
MessageRow mr = new MessageRow(getContext());
// stuff to set the TexView text and color
mr.setLayoutParams(new TableLayout.LayoutParams(TableLayout.LayoutParams.FILL_PARENT, TableLayout.LayoutParams.WRAP_CONTENT));
this.addView(mr);
View separator = new View(getContext());
separator.setLayoutParams(new TableLayout.LayoutParams(TableLayout.LayoutParams.FILL_PARENT, 3)));
separator.setBackgroundColor(Color.RED);
this.addView(separator);
}
Because you have 100 rows you could try to set a drawable with a separator line as the background for theTableRow(header and MessageRow) instead of the above method that adds another 100 Views to the layout.
Extra Note:
You have a lot of views to add to a single activity layout, you are talking about 100 rows, and if your MessageRow is more complex than a simple TextView(and I think it is) you could get in some performances problems. I suggest you take a look at the wonderful ListView widget.
Don't have a programming environment here, but I'll try and answer some of your questions.
The reason your header row (button) is taller than your test based rows is because the button requires more space and the row accomodates it. The default button has padding on both the top/bottom of the text. I think your best option is to create your own button, which gives you the additional benefit of being able to control the look and feel. It seems like other people have had this issue before: Can't get rid of bottom padding on button
Your button is set to wrap_content which means it won't be any bigger than it needs to be (It will grow/shrink so it can fit the text "Column1" or whatever you put there). Instead of making the Button WRAP, I suspect you'll need to make it FILL_PARENT.
It's not your Table Row that needs to fill the screen width, it's your table that needs to fill the screen. Wherever you define your table, it's probably set to WRAP_CONTENT for the Horizontal dimension. Set it to FILL_PARENT and your table should expand to the full width of whatever it's container is (In this case, it should expand the full width of the screen)
There are probably several different ways you can do this. One method I used somewhat recently is to utilize the View tag which essentially looks like a horizontal bar across the screen. Below is a link to how to implement it.
http://sonnygill.net/android/horizontal-rule/