Positioning dynamic controls dynamically in iOS ViewController - ios

First of all, let me tell you that I am new in Xamarin.
I am facing a problem in rendering controls dynamically on UI.
Approach I am using is: Xamarin.iOS
I have list of Questions having different Question Types
I loop through all questions and render them according to the question type.
Client wants to have HTML in Question Title, so that he can add any type of html tags including images, links etc in HTML. (I cannot use ‘NSAttributedString’ because it doesn’t support all HTML tags)
I am not using AutoLayout
I think UIStackView is a new control which is not available for older versions
Problem is, when I render UIWebView for QuestionTitle, and other control (let us say UITextField) for simple input from user, I do not know about the exact content length of Title (which is HTML) and therefore, I set default height of UIWebView as ‘100’ and once WebView is loaded, I set the height of webview according to the content size height. While rendering control, I calculate the Y-axis for every control to be rendered. When WebView is loaded, its height gets shrunk or expanded according to the size of content and therefore, the preceding sibling’s y-axis remains there since we don’t know how much siblings are there whose y-axis should be adjusted. (Keep in mind we have multiple webviews, as we have more than 1 question).
Is there any way, we can position all controls automatically (Just like we have LinearLayout in Android)?
Is there any better approach I can follow in order to resolve this kind of blocker?
I will really appreciate your help in this problem.

Related

Get items visible in viewport of Grid in Vaadin 8 & 10

The Grid widget in Vaadin 8 & 10 offers a method to get a Set of the currently selected items: Grid::getSelectedItems.
In a similar vein, I would like to get a collection of the items that are currently visible to the user in the Grid. Say my Grid widget holds 10 items, but only 5 are viewable because the Grid widget is too short to display them all. I want to know which of the five can be seen by the user.
This is not trivial task, I have something similar, but not exactly this case before. First of all, I would I would create custom Layout component, e.g. by extending CssLayout in similar fashion as has been discussed here ( How to make UI receive scroll events ) in addition to reporting scroll events I would report the position of the layout on the viewport (see http://www.gwtproject.org/javadoc/latest/com/google/gwt/dom/client/Element.html ). Yes GWT and client side development is required.
I would use this layout as wrapper for the Grid, i.e. Grid would be in the layout. You could extend the Grid component as well. But I think doing the layout wrapper gives you nice tool that you can use with other components as well for which you need to determine, whether they are actually visible or not.
This way I can then calculate which portion of the layout is in the viewport. As you see, there are number of cases here, e.g. only bottom of the Grid or top of the Grid is visible. Then I need to know row-height, header height, etc. That enables me to calculate how many rows there are visible. I hope you get the idea. The outcome for the generic case will be rather lengthy piece of code when all possibilities are enumerated. This calculation you can do on server side.

XtraReport text overflow cutting text in half vertically

I have an XtraReport that overflows text on to the next page but occasionally cuts the last line of text from the first page in half when it does.
I would normally handle this with the height property of the text area but I am unsure how to target a specific table row of an XtraReport to work out what the remaining height of the page is to achieve this or whether that would even work in this instance.
I'm rather hoping there's a simple work around to achieve this, please don't go too much out of your way to help out as I won't be investing much development on this.
I don't think there are any settings I have missed within the designer, perhaps there's a golden font size or line height that the reports want to overflow correctly.
Any help or direction would be greatly appreciated, thank you.
If there is no simple way, I will just have to loop through the tr / td tags and see if by manipulating the height I can find that sweet spot, i just worry that it will hide page 1 but still be split on page 2.
It seems to me that you use the ASPx/MVCx -DocumentViewer,
this control shows you a html content which is not suitable for pixel-perfect documents.
I recommend you to try the ASPx/MVCx WebDocumentViewer which is like the the Google Docs shows pixel-perfect document and more convenient with bootstrap and other progressive web frameworks.
here are demo and docs.

How to make Filemaker textbox resizable according to content

I'd like to create a layout to show this table in list view, the point is to make the text field resizable according to content. I have try several method, but all fails. I am using FileMaker 12.
Any help much appreciated.
For Browse mode you can set layout objects to dynamically resize based on the layout size, but not on the object contents. If you need this functionality in Browse mode you will probably need to use a web-viewer.
In Preview mode you can use sliding left and sliding up for reduction of the size of the layout objects, but there is no option to expand.
In Browse and Find modes, if a field isn't set to have a scroll bar, the field will expand while the user is entering data, but only then. It will return to the default size when the user navigates to another field or another record.
In Preview mode, you can make the field larger than it could possibly need and set it to slide up and also reduce the size of the enclosing part. But the user won't be able to interact with the interface of the layout (can't click buttons, change data, etc.).
A workaround might be to use a tooltip. If you set the tooltip to the contents of the field itself, then the user can hover over the field to see any expanded contents.
If you really need exactly the functionality that you mention (which I would define as having field height and enclosing body part expand in list view based on the field's content length while in FileMaker), the only way I could see doing it would be to use custom web publishing to create a web page and use FileMaker's web viewer to show that web page. F 'n' web has an article that might be of some assistance if you go this route.

Forcing Vaadin Component to occupy it's space in invisible state

I have a Label and a Progess Indicator in my Vaadin indicator. It is dynamically made visible in the UI. There is a Tree below this Progress Indicator.
When the program dynamically sets the visibility of the Progress Indicator to true, the tree shifts down and the UI shakes due to the shifting.
Is there any way to make a Vaadin component occupy it's space, even if it is invisible and hence, when made visible it must not try to borrow space from other UI components?
What I am looking for is a feature similar to setRendered(true) in flex and actionscript programming.
Thanks for your help.
Finally I got an answer to my question. I just replaced the invisible components with a dummy visible label with no text.
And used it alternatively to switch between visible and invisible.
I asked the question in the Vaadin forum, and here's the response I got, from Kim Leppanen:
With Vaadin 7, if you set a component's visibility to false, then the component's information is not sent to the browser at all - it is just as if the component wouldn't exist in the layout at all.
I can quickly come up with two solutions. If you know the size of the component whose visibility you want to toggle, then you can use placeholder components - such as a Label. Put a label with the correct size in the place where you want the component. When you want to set a component as visible, then replace the label with the actual component.
The second option is to use css. Apply the css attribute "visibility: hidden" for the component you want to hide. Note that the component is not "truly" hidden. Let's say that it is a button. A user could still inspect the DOM tree and see the button in the code, change the visibility of the component on the client side (eg using developer tools or firebug) and then see and use the button as if it would be visible in the layout.
I am putting it here because people might add some more useful answers there. For a detailed explanation please see this.
Use this following example to the component you want set invisible but keeping its occupied space:
Image home = new Image();
home.setSource(HOME);
home.addStyleName("visibility: hidden");
OR
home.addStyleName("visibility: collapse");

iOS iPad archtecture for vertically scrolling book app with bookmarks

This app involves converting a book into an app. It has rich text (headings, bold, bullets, etc.) and instead of a page flip UI, it would be built in a split view controller. The master (left sidebar) would list chapters and bookmarks. The detail (right side) would have the chapter's contents and it would scroll down until the end of the chapter. Similar to Apple's Mail app on the iPad.
From my research, I can achieve the rich text by using HTML inside a UIWebView. What I'm not sure about is how to get bookmarks to work properly. Because there are no pages, the bookmark would need to be a vertical point in the chapter's content. For example, lets say the user reads half of Chapter 2, i.e. they have scrolled 50% of the way down. They could create a bookmark here.
My initial thoughts are to break the book's content up into "blocks", possibly paragraphs. For each chapter, in the detail view, use a UITableView. In each UITableViewCell, have a UIWebView with the HTML for each block. This way when the user creates a bookmark, we can store the cell's index path.
What would be the correct approach to this app?
I have created the same kind of e-book once, called Afili Lugat.
My approach was using javascript method:
element.scrollTop
to get the scrollbar position and keep that position under a SQLite database with a name for the bookmark. For this e-book I struggled with font size because it was changeable. When a user changes the font size the scroll position was not correct anymore as the page length increases/decreases. So I was keeping the font size in the SQLite database. So I was loading the page, changing the font size and scroll the page to offset value that I was getting from element.ScrollTop using window.scrollBy(0,<offsetvalue>);
Hope this helps.
Uygar

Resources