Flyout Theme Bug When Using Custom RequestedTheme On Any Element - xaml

I have the following situation in Windows Phone 8.1:
Emulator with Dark theme
A Page Flyout
An element with RequestedTheme="Light" (inside a DataTemplate, in many pages)
This happens:
Open a flyout: it is Dark (as the app theme). Ok.
Navigate to a page that there is the element with RequestedTheme="Light". Ok.
Open a flyout: it is Light! Not ok!
Now all my Flyouts are Light. But my ApplicationTheme is still Dark.
It seems to be a bug.
Does anybody see if I am doing anything wrong?
--
Additional info: Flyouts doesn't have a RequestedTheme property, so I think it use the ApplicationTheme. But maybe there is something else.

Related

Can i disable hamburger in shell

if you can help me please answer this post please
I Use shell in my xaml page but i dont need hamburger in tittle view
if you know how to disable this please answer me
Photo
You can set Flyout behavior in Shell to disable the hamburger in shell.
The flyout can be accessed through the hamburger icon or by swiping from the side of the screen. However, this behavior can be changed by setting the Shell.FlyoutBehavior attached property to one of the FlyoutBehavior enumeration members:
Disabled – indicates that the flyout can't be opened by the user.
The following example shows how to disable the flyout:
<Shell ...
FlyoutBehavior="Disabled">
...
</Shell>
Note:
The FlyoutBehavior attached property can be set on Shell, FlyoutItem, ShellContent, and page objects, to override the default flyout behavior.
thank For Junior Jiang - MSFT
I Following his anser
and i forget up date Xamarin form 4.2 to 4.3
https://www.youtube.com/watch?v=BqSlfrsJEns
and add
<Shell ...
FlyoutBehavior="Disabled">
...
</Shell>

Use an Icon Font in Xamarin Forms TabBar

I am just getting started with Xamarin Forms, so please excuse what may well be a rookie question...
I started out with a new Shell Forms App in Visual Studio, so some code was generated for me.
There is an AppShell page which contains a TabBar control. Inside this are Tab controls were I can set my ShellContent pages.
Each Tab has an Icon property, but this apparently only accepts PNG icons.
How can I use an icon font (which is already hooked up to display icons correctly as I am using them in the content of another page) for my Tab icons in Xaml?
I am using Xamarin.Forms 4.0.0.497661
You have to use FontImageSource to do that.
<Tab Title="MyTitle">
<Tab.Icon>
<FontImageSource FontFamily="{StaticResource IconFont}" Glyph="" Size="Small"/>
</Tab.Icon>
...
</Tab>
The solution below worked for me.
Copied the files from fontawesome inside Assets folder
fa-brands-400.ttf
fa-regular-400.ttf
fa-solid-900.ttf
Important the reference "Font Awesome 5 Brands" according to icon needed
<Tab.Icon>
<FontImageSource FontFamily="fa-brands-400.ttf#Font Awesome 5 Brands" Glyph=""/>
</Tab.Icon>
That's a great question. You can't use the tab icon property in a straight forward way to accept the icon font, unless you convert it into a PNG.
If you want to go that route, you can try this, you might have to deal with permissions for saving images. Worth a try!
You can do that with custom renderers as a workaround. Check this example on GitHub here: https://github.com/winstongubantes/Xamarin.Forms/tree/master/CustomIconizeFont

Office UI Fabric DetailsList checkboxes rendered incorrectly on mobile devices

The Office UI Fabric DetailsList component has an odd behavior when viewed on a mobile device. When you check a selected item in the list, all of the checkboxes suddenly appear (unselected).
Before selecting:
After selecting:
You can repro using this codepen: https://codepen.io/elegault/pen/GPwNMQ
Simply open the browser dev tools and select any device from the emulators list, and then toggle on a selection. You'll notice the checkboxes do not all appear when in full browser mode.
I can't find any properties for the DetailsList component that controls this. My component's settings are below. Is this behavior by design or a bug?
const projects = <Fabric.DetailsList
items={this.state.items}
componentRef={this._detailsListRef}
columns={columns}
selectionMode={Fabric.SelectionMode.single}
selectionPreservedOnEmptyClick={true}
enterModalSelectionOnTouch={true}
selection={this._selection}
/>;
Looking at this simple detailslist example I don't see the same behavior.
https://codepen.io/dzearing/pen/EgqMZq
<p>
Can you create a reduced test case and then if you still see the problem, submit an issue to https://github.com/OfficeDev/office-ui-fabric-react/
Microsoft has verified that this behavior is by design:
https://github.com/OfficeDev/office-ui-fabric-react/issues/7808
"The idea is that on a touchscreen device, it shows you the checkboxes so you know what can and can't be selected (contrary to a mouse controlled device where they have the option to hover over a row to see the checkbox visible)."

iOS10 Safari Keyboard Popup

I have a single page web app. The keyboard pops-up everytime I click on the screen.
There are no text input boxes in the DOM at all.
How can I debug why the keyboard is popping up.
You can see examples of this strange behaviour at https://blight.ironhelmet.com and https://np.ironhelmet.com
update with a clue: A user is now reporting that rather than the keyboard, a dropdown selection spiner is popping up all the time, long after that dropdown has been removed from the DOM.
For React users:
I had the same thing happen in a React single-page app with React-Router. I didn't write code to remove elements from the DOM, but of course React does that for you.
On my site, there are React components that contain one to four input fields. After any such component appears, and then is hidden (unmounted / not rendered anymore), then any time the user taps a link, the keyboard pops up. This makes the site unusable. The only way to make it stop was to reload the page.
The workaround: calling document.activeElement.blur() in componentWillUnmount for the wrapper component around my <input> fields did the trick.
componentWillUnmount()
{
if (document && document.activeElement)
{
document.activeElement.blur();
}
}
Note that calling window.activeElement.blur() did not seem to do anything.
There's a thread in the Apple support forums about this issue:
https://discussions.apple.com/thread/7692319
Looks like the keyboard was holding a reference to input after I had removed them from the DOM.
I added a test when removing element to see if it was the current activeElement, then, if so, calling document.activeElement.blur() before removing it. Seems to have solved the problem so far.

Dojo - ScrollingTabControllerMenuButton freezes TabContainer in Firefox

I recently by accident found an issue I have with a web application I have made entirely with dojo.
I have a TabContainer and a toolbar with buttons and each button adds a Tab in the TabContainer.
Each of these new Tabs has as children, created programmatically, one or more of the following BorderContainers, ContePanes, Editors, FilteringSelects, Uploader and Buttons. I should point out that I do not have parseonLoad: true byt false and I call manually the parsers.parse when required. I should point out that in the ContentPanes in the content attribute I put also declarative filteringSelects and ValidationTexts and Uploader I hope that is not a problem.
Everything is working great in all browsers even in IE9 besides one thing in Firefox 12.
When I create many new tabs and the ScrollingTabController gets created (The left/right and dropdown arrows of the tabstrip) when I use the ScrollingTabControllerMenuButton (the down arrow at the far right) the TabContainer behaves wrongly and eventually freezes. Firebug shows weird errors when I select different tabs via this menu of the tab strip. Errors of the buttons that I have in these tabs, weird errors mentioning StackController or ScrollingTabController
[ e.g.
button is undefined
if(this._selectedTab === button.domNode){ StackController.js (line 222) ]
different each time...
This weird behavior only happens in Firefox. IE9 and Chrome do not have any issue at all!
Could anyone have an idea on what might be the problem? Is it a known bug? Is it a problem that I have many widgets in each Tab ?
It seems that it is indeed a browser specific bug and as I was told it should be fixed in the following releases
I first reported it to the dojo community and from there they reported it to the Firefox team
http://bugs.dojotoolkit.org/ticket/15496