ngx-datatable - Setting a table height - ngx-datatable

I have an ngx-datatable with server-side pagination. Given a page size of say 100 rows, the table grows vertically to display all the rows. However, I want to keep the table to a fixed height though, say with a viewport that shows 10 and a vertical scrollbar to scroll through the 100 in the current loaded page. (not using server-scrolling (scrollbarV)) - local scroll of the loaded page.
Is there a way to do this?
I also noticed that server-scrolling appears to use 5 rows by default even if my page size is say 100. Is that a setting somewhere?

Related

How does ScrollView paging works?

Docs says When pagingEnabled is set to true, the scroll view stops on multiples of the scroll view's size when scrolling. This can be used for horizontal pagination.
I am trying to implement a carousel with say 15 items. I want to display only 5 items at a time. Every time the user scrolls, I want to scroll to the next 5 items
I am trying to figure out how the page size determined? in case of the above example, I want to set the page size to 5
What are the mandatory properties to set to achieve pagination?

React-native layout with center element and bottom container that should grow with children

I have a layout that keeps occurring in my codebase, that I'm not able to style properly with react-native flex only.
I want to have a top and bottom container which initially should both take half the screen space. The bottom container should grow with it's children and the top container should shrink if need be.
I've created a snack with the code here, where the layout behaves as it should, but it's using a workaround via onLayout: https://snack.expo.io/#domir/center-problem
The same problem is easily solved in web via flex: 1 on both containers. In react-native if I have flexGrow: 1 on both of them, they only divide leftover whitespace.
E.g. Currently for a display height 1000 a top container will get 400 while bottom container will get 400 + 200 when a 200 child is placed there when using flexGrow: 1. What I want is both to get 500 until the bottom container has 3 children with 200 each. Then I want the top container to get 400 and the bottom to have 600.
Not sure if there's a way to solve this JUST with flex (probably not) - and I'm not sure what your requirements are, but here's a way to solve that without using onLayout but instead just use maxHeight percentages:
https://snack.expo.io/#sudoplz/center_problem_maybe_solved
All I actually did was I used the existing counter value you had in that snack, to modify the input of maxHeight
The top parent is now styled like that:
maxHeight: `${Math.min(50, ITEM_HEIGHT - counter * ITEM_HEIGHT_PERCENTAGE)}%`
which means that until the bottom parent is full, it's max value will be 50%, as soon as it's full, the maxHeight becomes less and less gradually (depending on he number of children on the bottom view)
In my snack I also got rid of some unnecessary views you had, not sure why they were there.
Here's how that looks like now:
Would that work for you?
As you can see below, the maxHeight solution does not work quite well on a real device. Some of the lower boxes are cropped off or overflow the screen.
Although the solution does not have to be with flex only, I do have a flexible container at the bottom. It contains text and a varying amount of error messages. The yellow space would contain whitespace and the green container would contain some text input. On large screens, this is not a problem, but for small devices, the error messages can take up quite a bit of space and I'm not able to calculate the size of the lower parts in advance.

Inaccurate Form size

I am trying to create a form with a 500 x 500 form size.
Then I create a panel with a 500 x 500 size.
Logically, the panel size would be the same as the form size.
However, the panel turns out to be significantly larger than the form.
This gave me the conclusion that the form size turns much smaller than the given size which is 500 x 500.
How do I make the form size have the accurate size instead of having it smaller than the given size (e.g. 500 x 500)?
Here is a video that I’ve made to give you guys a clear picture of my problem.
https://youtu.be/RwN2ZpdPMus
The form size refers to the outer edge. The form has a resize border all around it plus a title bar where you cannot place controls. The remaining part inside is the ClientRectangle. You can get its size through
frm.ClientRectangle.Size
' or inside the form itself
ClientRectangle.Size
If you set your panels Dock property to DockStyle.Fill, it will automatically fill up the whole available space. You can do so in the designer in the properties window through a graphical input or in code. The Size property, in this case, is irrelevant.
If you add serveral docked controls, the sequence matters. The fist ones will occupy the outer edges, if docked to some edge.

Minimum window size recomandation

I am working on OS-X app, and I need advice on the window size.
Before someone to jump and declare this question as duplicate, I have read this post:Window Size for Mac application but it didn't help me to solve my issue.
My issue is the following. I use NSTableViews to display some of the data. However in some windows, I am getting horizontal scroll bar in the NSTableView due the numbers of the columns.
Things to be worse, the data in some of the columns are not completly visible, you have to resize the column to reveal the complete text in that cell / column.
I am thinking of increasing the initial window size, but I can't decide how much.
My current window size is 1024 x 768. User can make the app full screen, and window can be resized to be larger than this size, but not smaller.
Any help will be deeply appreciated.
Regards, John
For the table, you should set minimum widths for each column. Select each column in the document outline and view the Size inspector. You should also review the Resizing pop-up on the Attributes inspector.
Similarly, you should review the Column Sizing pop-up on the Attributes inspector for the table view itself.
With respect to the window size, I recommend that you use auto layout if you're not already. Apply appropriate constraints to all of the view, ultimately relating them (directly or indirectly) to the window's content view. Then, don't set a minimum size for the window itself. Let the constraints impose an effective minimum (and potentially even maximum) size.
The trick though, is that not all views will have an intrinsic minimum size. For example, the table view itself may not get any narrower than the sum of the minimum widths of its columns, but it's in a scroll view. The scroll view is allowed to get narrower than the table view, resulting in horizontal scrolling. So, you may need to add an explicit minimum width constraint to the scroll view.
If you set constraits for text inside the rows, you may get some horizontal scrolls. But if you set the constraits for the app elements like UITableView to the borders of the app window, you may resolve this issue.

Vertical scrollbar with a dojo OnDemandGrid

Is it possible to add a vertical scrollbar to an OnDemandGrid?
Yes, I realize that an OnDemandGrid lets you scroll through a million records, and it will be awkward to imagine a scrollbar that lets you scroll all the way up and down through those million records, but I'd say it'll be good if there was a way to add a scrollbar at least to scroll through a reasonable subset around the visible viewport.
Never mind my question - I realized that it was actually showing the vertical scrollbar by default all this while, but it was hidden off the right of the page due to a large width on the div containing the dgrid.