React-Virtualized using cellmeasurer with a maximum width? - react-virtualized

Is there any way to use react-virtualized's CellMeasurer with a maximum column width which then made the height expand?
For example, I may have an id field in column one of the grid. This would never grow too large, but I want to size it based on the largest value. Then in column two I have a text field that I am not too sure how large it will be. If it turns out that all of my current data set has a small value in column two, I'd like to size based on the largest value. If it happens to have some larger text (over a certain width) I'd like to use that maximum width, and then expand the row's height to accommodate the lines text.
From what I can see in the docs and code, this type of feature isn't supported. If this is the case, I think my best method would be implementing my own CellMeasurer with a slightly more complex _measure function. Does this sound like the proper course of action?

You should be able to do this by adding a style constraint to your rendered cell. CellMeasurer just measures what the browser reports- and CSS controls the browser's max width.
React might freeze the style object too so use spread rather than directly modifying:
style={{
...style,
maxWidth: 300
}}

Related

Can't get flexbox container to expand horizontally to match content

The flex layout below is working except the content container (blue) is sized by the columnar items before they wrap.
I want the blue container to expand to the right to fit the content (ie the horizontal measure after the items wrap)
Any hints would be appreciated.
Some more research shows that this is a well-known, long standing, bug, but only for the column orientation, not for the row orientation.
So the solution is to switch to "upside down" day. Turn the column into a row with the css writing-mode:'vertical-lr', then specify flex-direction:'row to match, and it works!
... but all direct children need to have their writing mode reset: writing-mode:horizontal-tb

restrict table dimensions to the table placeholder dimensions in python-pptx

i am trying to add a table to a presentation using python-pptx with a specific dimensions
i created a slide layout from power-point which contains the table placeholder in the area i want and loaded it using python-pptx.
slide_layout
but regardless of the placeholder dimensions, the table itself after creation is exceeding the placeholder are.
mainly it is dependent on the number of rows as per the documentation "The table's height is determined by the number of rows."
shape_id, name, height = self.shape_id, self.name, Emu(rows * 370840)
i tried to update the placeholder.py file manually and change the row height but the same output appears.
shape_id, name, height = self.shape_id, self.name, Emu(rows * 18429)
the table is insisting on exceeding the placeholder area as per the below image
output
below is my code, any clues ?
from pptx import Presentation
# the presentation including the table placeholder
prs = Presentation('Presentation2.pptx')
slide1 = prs.slides.add_slide(prs.slide_layouts[11])
table_placeholder = slide1.shapes[0]
shape = table_placeholder.insert_table(rows=22,cols=2)
prs.save('test.pptx')
Tables in PowerPoint expand vertically to accommodate new rows; that's just the way they work. You will need to do any resizing yourself, which you may find is a challenging problem. This isn't the same kind of problem when a user is creating a table in the application because they will just make adjustments for fit until it looks best for their purposes.
You'll need to adjust font-size and row-height and perhaps other attributes like column-width etc. based on your application and whatever heuristics you can resolve, perhaps related to the row count and length of text in certain cells and so on.
A table placeholder really just gives a starting position and width.

Excel multiple lookup array

I have a table that I would like it to select the smallest size picture frame that could be used based on the size values, basically return the smallest frame that would fit the image.
So far I have a vertical array formula that can select the smallest frame that will fit the size requirements but I have one column that I would want to stay static i.e another match that would only give the results from the selection with the same type ID/
My current formula is as follows:
= INDEX($A$2:$A$16,MATCH(4,MMULT((I2:L2<=$B$2:$E$16)+0,{1;1;1;1}),0))
At the minute i am just referencing the type as another lookup but i would like to have it so it will only attempt to match ones with the corresponding type, currently if the size is larger than availible within the correct type it will select a type that has that size availible.
I’ve tried to show what i mean in the screenshot! I want it to only pick up type 1 but it is selecting type 3 because the mmult is seeing that is the only one that would fit.
Help is much appreciated!
Thanks!
If the frame sizes to be looked up are in ascending order, you could use something like this
=INDEX($A$2:$A$4,MIN(IF((($B$2:$B$4>=F2)*($C$2:$C$4>=G2)*($D$2:$D$4>=H2)),ROW($C$2:$C$4)))-1,1)
based on this sort of data layout
Ended up using a load of nested if statements to section of the types to make it simpler to code
Thanks anyway peeps!

react-virtualized List: How to remove empty space when the list is too short?

I am using react-virtualized List to render a list of data. When the list is too short (is height is smaller than the "height" prop of List component) there are a lot of empty spaces at the bottom (because the height is fixed). Is there any way to fix this problem?
The fix is to detect when this is the case, and just pass a shorter height value to List.
This is what react-virtualized-selected does for short drop-down lists, for example. You can see the code for that here, although it may be more complicated than what you need because of the fact that it supports variable-height rows.
If your rows are fixed height, then the calculation is much simpler:
const height = Math.min(maxHeight, rowCount * rowHeight);

force breaking a string in a fixed width Gridview cell

I have a Gridview control on an ASP.Net page with fixed width cells. The data coming from the database occasionally comes over as a contiguous string of characters. When there are dashes in the string, it will break so as not to upset the width of the layout. If there are no dashes (specifically, I'm dealing with underscores), the string will not break and forces the cell to widen out, thus upsetting the layout of the page. Is there a way to tell the cell to keep its width and break the string? As it stands, I don't have access to the field's data directly, as the GridView bind its datasource to a dataset object coming from the database. Thanks for any feedback.
If you handle the RowDataBound event you'll be able to break the string "manually". Otherwise it'll only break based on "HTML rules".
First thing to note is that this doesn't have a lot to do with ASP.NET but is rather a pure HTML (and CSS) problem.
A possible solution is to use the css attribute table-layout: fixed and set some fixed width values to all columns. The disadvantage of this approach is that the total table width is fixed so it doesn't scale with the window size.
Another possible approach is to display in columns shorter strings using a utility function that cuts the long strings to a maximum length.

Resources