DatePicker and ListPicker display incorrectly - datepicker

I am using a DatePicker along with a ListPicker in my Nativescript application. However neither of these elements display correctly. I've had to blank out some sensitive information from the screenshot, but the issue is visible in the DatePicker.
It seems that the values are offset, and I cannot find out what is causing this. Has anyone else come across this issue before? Or have a fix for it?
These elements are of utmost importance to my project.

This happens because the component is inside tag ScrollView. If I remove it, works. I have tried remove padding and margin of ScrollView and nothing.

The inner StackLayout is required for the ScrollView to work properly. If I have more than one element (such as an input form - which is the scenario in my application), only the last element is displayed without the StackLayout.

Related

How Do You Filter and Sort Data in a CollectionView

I have a CollectionView on a page that is displaying data from a List<> of items. I do sorting and filtering in a code behind on the page by changing the List with LINQ, and then setting the BindingContext of the view, like this:
MyView.BindingContext = FilteredData;
On IOS this works fine, every time, no problem. On Android, I can change the data a few times (it varies - normally three to five) and then the page doesn't display any data. In the debugger I can check and still see the ItemsSource has all of the items, but nothing is displayed. I then "switch" to my other view on the page, which is done by hiding one DataGrid row and showing another, then "switching" back. The data still isn't displayed, but after I do that I can run the code again that does the sorting and filtering and it starts working again - the data is displayed on the page. Not only that, but after I do that, it works every time from that point forward on Android.
I've spent hours trying every thing I can think of to try and find an event or property or anything that would indicate when this problem occurs so I can try and find a work around for it. I'm at a complete loss; wondering if there are suggestions for how to capture and/or fix this problem.
I did find a combination that worked to resolve this issue. I changed the page so that the CollectionView at issue is in the Grid row that has a non-zero (i.e. visible) height when the ContentPage loads. After doing that, the code works as expected. Previously, it was in a Grid.Row whose height was set to an absolute 0 when the page loaded, and then the height was changed to a non-zero value when a button was clicked.
FWIW, this is similar to other issues I've seen with MAUI on Android, where the visibility of certain controls as well as the order in which you modify them can interfere with rendering data binding results.
I solved sorting using a SortedList and made the list items inherit from IComparable, but I don't love the solution because a SortedList is not an ObservableCollection, and because implementing IComparable can be tricky and leaky.

Ionic v4 ion-slides problems

I have created a component in my project that is purely an ion-slides UI component. I've injected into the main page of my side-drawer template app and I'm experiencing a number of issues/annoyances:
The content doesn't always center within the main pane. It seems as though the width of the individual ion-slide items all get set with an inline element style width that is greater than the pane width! I've realised that this only happens when the whole app is loaded. If I click on the side menu item of the page to reload it individually, the issue disappears. This leads me to believe it's an issue with the order that components are rendered. Can anyone help me understand what is happening? Is it a bug?
Undesired behaviour
I can't work out how to get navigation arrows to display/work - is this possible?
https://stackblitz.com/edit/angular-ionic4-test-yuppm1?embed=1&file=src/app/app.module.ts
The above Stackblitz should help to give you an idea of my setup but it doesn't show the problem I'm experiencing. It does show one other peculiarity though:
With loop set to true in the options, when you get to the last slide and you go to the next slide, it jumps to second element rather than the first! Any help on understanding why this is happening will be appreciated.
Thanks

`ListView` not scrolling to exact position when a few list item are of big height

I'm using ListView to display my dynamic content. Based on selected option, I've to scroll to some specified position in ListView. This works great when the list item height is not that big, i.e. it covers the whole screen. But when big height item are present in list, the scroll doesn't take me to proper position, instead it takes to some in between position. I tried using both of the following but same result.
listView.smoothScrollToPosition(myItems.indexOf(thisItem));
listView.setSelection(myItems().indexOf(thisItem));
Can anybody point the possible cause of the issue and also give some suggestions.
The workaround suggested here worked for me except that I called both functions, smoothScrollToPosition and setSelection, sequentially instead of using OnScrollListener. Though its not giving smooth scrolling effect but it's fulfilling my requirement. If any body can suggest a more proper solution, it's welcomed.

Placeholder form attribute causing responsive design to break when switching orientation

Going to try my best to explain this as I don't have a working example at the moment.
I've found now with two sites, both using twitter bootstrap as a framework, an odd occurrence regarding the form placeholder element.
Take this theme for example, and note the newsletter form in the footer.
Theme
It uses the placeholder form attribute to label the name and email elements.
Now when viewing on an iPad/iPhone these display fine. Switch the orientation, and it will adjust fine, but then switch the orientation back, (i.e. portrait>landscape>portrait) and it throws the page off and knocks it off to the left. The layout is no longer fixed to the width.
I cannot understand why this is?
Any ideas?
This is a bug with iOS6, resolved in iOS7. Setting overflow: hidden; on the parent element of the input element (for example the form) fixes the problem.

Combobox show text properly

I have a combo box that when I open it should show text like
However I get something like
with the scrollbar set to middle. Thing is sometimes for the same values it shows properly
and sometimes it shows from middle(for same value).
I want it to show properly like in the first image and I've tried a couple of things but with no succes.
itemSection.setHoverAlign(Alignment.LEFT);
itemSection.setTextAlign(Alignment.LEFT);
itemSection.setAlign(Alignment.LEFT);
... and other irelevand stuff ...
Any help is highly appreciated. Thanks alot!
If I am not getting wrong, You want to set your scrollbar at particular position. FOr that you need to ovverride the css of that and try to set scrollbar position to 0. So that your problem will get solved.
The problem with any kind of selections box is, that the boxes display and behave completely different across browsers. The older the browser the worse it handles long texts in selection boxes (some just truncate the text). I suggest to keep the displayed text as short as possible. That way you can avoid this problem.
If you really need long description, you can try to add a tooltip to every entry. Or use a different widget to make the select from, e.g. some custom widget in a separate dialog...