I'm trying to do the following layout with this code (the widths and heights are just for debug, ideally I would have both of the tables have 50% of the width. Also the superclass is a Table)
left().top()
add(Label("Player name", UI_SKIN)).center().expandX()
row()
add(Table()).width(50f).height(50f)
add(Table()).width(200f).height(50f)
setDebug(true, true)
Which results in this, for some reason the tables don't seem to go on their own row, and instead the last table pushes the label to the left. If I only add one table it works fine (can't add another screenshot because I don't have enough rep...).
Any help would be greatly appreciated, I'm running out of ideas by now.
You can do in this way
stage= Stage()
Gdx.input.setInputProcessor(stage)
var skin= Skin(Gdx.files.internal("skin/glassy-ui.json"))
var table= Table()
table.defaults().pad(10F)
table.setFillParent(true)
var label=Label("PLAYER NAME",skin)
label.setAlignment(Align.center);
var first_table=Table()
first_table.setDebug(true)
first_table.add(Label("FIRST TABLE",skin))
val second_table=Table()
second_table.add(Label("SECOND TABLE",skin))
table.add(label).colspan(2).fillX()
table.row();
table.add(first_table).expand()
table.add(second_table).expand()
stage.addActor(table)
stage.setDebugAll(true)
And the output is :
Related
In the code snapshot below in app.component.html, I display clickable rows in a table in Lines 39 to 58. Once the user clicks a row, I display other relevant rows in a table named suraTable as shown in Lines 63 to 77. Namely, when the user clicks on a row, the function onSelectAya(aya, suraTable) in app.component.ts is called. That function loads the necessary rows and the table is displayed.
What I am stuck with is this. Suppose suraTable ends up with 100 rows. The current behaviour is that rows 1, 2, 3... are displayed of course. I need to be able to show the table at Row 50 say (information carried in the parameter aya on Line 91). How do I scroll to that position? I tried the scrollTop way but when checking the values before and after the setting of suraTable.scrollTop, the value is always 0 (0 pixels that is). Line 100 shows that when console.log(suraTable) is reached, expected output is generated in the browser, which means that I am getting hold of the element correctly to start with.
So, how do I scroll to a specific row in a table, or to an item in a list (I could convert the whole structure to a list if easier) from within the app.component.ts component? Thank you.
<mat-row id="{{task.taskId}}"
*matRowDef='let task; columns: columnsReadyTask;let i = index;'></mat-row>
if working with datasources, you will need some delay after getting element on the page with id...
setTimeout(() => {
const selectedRow = document.getElementById(taskId);
if(selectedRow) {
selectedRow.scrollIntoView({block: 'center'});
}
}, 500);
This may not work on old browsers.
If this is simply a scrolling thing, you could add specific id to your rows so you can know theyr number, and then do
var elmnt = document.getElementById("rowNumber"+rowNumber);
elmnt.scrollIntoView();
If when the scrolling is taking part your element is not rendered on DOM, try adding a callback for when that rendering is finished. If that is not possible, maybe a setTimeout can do.
jspdf-autotable examples['header-footer'] example gets me most of what I need for my task.
I am trying to add rich text (constant font some bold and under line words) before and after a table. looking at examples.content did not make it clear.
So a complete PDF might be:
1. some paragraphs of text
2. a table on more than one page
3. some paragraphs of text
4. another table on more than one page
how do I combine all of this in one var doc = new jsPDF(); ?
Example code would be very appreciated.
The key is to use doc.autoTable.previous.finalY to get the final y position where the table ended drawing. You can than dynamically use that to draw text with doc.text(). If you want further guidence, please update your question with more info on what you have tried and what didn't work.
I am new to working on flex. I looked at several stackoverflow questions but they didnt seem to answer my question.
I am using Advanced data grid column to display my data in a table. I know that columns can be sorted using the controls on the table being displayed.
But is there a way to sort data based on a single column when the data gets displayed.
I used sortDescending ="true" attribute but no change in the data.
Any help is much appreciated
Try to dispatch event
var adgEvent:AdvancedDataGridEvent =
new AdvancedDataGridEvent(AdvancedDataGridEvent.SORT, false, true);
adgEvent.columnIndex = columnIndex;
adgEvent.dataField = dataField;
adgEvent.triggerEvent = triggerEvent;
adgEvent.multiColumnSort = false;
on your AdvancedDataGrid to sort some column
I am creating a HTML table inside the dart code. then i add rows to the table (TableRowElement) and cells (TableCellElement) to the rows. Then I want to set the colspan of the cells. Or even print the colspan.
Here the program crashes (debugger says that the element has no get$colspan). However the API reference (http://api.dartlang.org/docs/channels/stable/latest/dart_html/TableCellElement.html#colSpan) shows colspan as an int (its not final either).
At the end, I want to create dynamic tables...
Thanks,
imran
p.s.: code looks like this:
var table = new TableElement();
table.addRow();
table.rows.last.addCell();
print(table.rows.last.cells.last.colspan);
table.rows.last.cells.last.colspan=2;
The property is colSpan (capital S)
Issue https://code.google.com/p/dart/issues/detail?id=15256 was created.
What you are seeing are hints, not warnings, out of the analyzer. (There is a bug to fix the UI to make this more clear).
If you change var table to TableElement table, then the analyzer will violate clospan as you probably expected. Since you declared table as a "var" the analyzer doesn't produce a warning. Since this can lead to bugs like the one you encountered, we are always in the process of adding hints.
Unfortunately, there seems to be a bug where the propagated type of table.rows.last.cells.last is not being resolved. I am looking into this now.
I better explan what i mean:
I have a Data Grid with automacticly genorated columns, i now need to add data items into
a spesific row / column of this grid e.g. col 2 row 3. It dosnt have a data provider at the moment as i wish to be very selective about which data goes where.
Which is the best way to do this?
I don't think it's possible to use a Datagrid without any dataProvider.
If you wan't to now where your data goes you could use an ArrayCollection with objects.
These objects can have multiple attributes like "column1", "column2" and so on.
So you can do something like this:
var obj:MyObject = new MyObject();
obj.column2 = "foo";
myDataGrid.dataProvider.addItemAt(obj,3);
Now you have placed "foo" in column2 of row 3.
But this isn't really beautiful, maybe you can achieve what you want without abusing the DataGrid.