Can we get the fluid design in Windows 10 UWP app with Xamarin.Forms?
https://learn.microsoft.com/en-us/windows/uwp/style/acrylic
Jason is technically right since the feature isn't publically released yet. However, you should be able to try it already if you're in the Windows Insider Preview program. This is what you need:
Latest version of Visual Studio (2017, 15.3)
Latest Windows 10 Insider Preview SDK (probably 16267)
Latest version of the .NET UWP NuGet Package
You can check that you have the correct version if Windows.UI.Xaml.Media.AcrylicBrush is accessible.
Using with Xamarin.Forms: I haven't tried this myself but technically it should be possible. You'll need to roll out a custom renderer for the UWP platform where you define the Acrylic brush and add it to a control (Grid in this example). You also need to make sure to check that the XamlCompositionBrushBase is present and have a fallback for the case where it's not.
if(Windows.Foundation.Metadata.ApiInformation.IsTypePresent("Windows.UI.Xaml.Media.XamlCompositionBrushBase"))
{
Windows.UI.Xaml.Media.AcrylicBrush myBrush = new
Windows.UI.Xaml.Media.AcrylicBrush();
myBrush.BackgroundSource =
Windows.UI.Xaml.Media.AcrylicBackgroundSource.HostBackdrop;
myBrush.TintColor = Color.FromArgb(255, 202, 24, 37);
myBrush.FallbackColor = Color.FromArgb(255, 202, 24, 37);
myBrush.TintOpacity = 0.6;
grid.Fill = myBrush;
}
else
{
SolidColorBrush myBrush = new SolidColorBrush(Color.FromArgb(255, 202, 24, 37));
grid.Fill = myBrush;
}
This code is taken straight from the article you linked to but it should work as is in the custom renderer.
Please notice, that even if you get it to work, there might be major changes to the API and you'll have to rework your solution again and again.
Related
i just downloaded the naxam mapbox and am completely lost the github page isn't much of help and there seems to be nothing else can anyone give anything usefull on how to implement the map view in the xamarin.forms app and thanks.
Short Anwser:
The Naxam.Mapbox for Xamarin.Forms Nuget Package, and all the associated Forms ones, have not been update since Sep 12, 2018, and the Mapbox SDK's for Android/iOS have changed since then, i tried this package and it's a bit clunky, i have manage to display the map, but inserting Geojson Sources/ Markers is not a pleasant experience.
EDIT 2019/10/13
Last month, Naxam updated their nuggets to the latest Mapbox version for .Forms, Android and iOS
Long Anwser:
If you really want to use Mapbox in your Xamarin Projects, the Naxam Binding Libraries for Android and iOS are still working today (18/06/2019), So one way to have it working for a Xamarin Forms Project is to implement both sdk's in their respective project, and use them in a Custom View Renderer (and be carefull, because those projects still need other Nuget Packages to work, and they don't warn you when you install them, be sure see the dependecies in the links i gave above).
Other way to have a map in your project is by using MapsUi (Remember that MapsUi is TileBased and Mapbox is VectorBased, so you might see less fluidity while using MapsUi). i will leave here some relevant code for the custom render in iOS for the implementation of MapsUi to get started:
MapViewRenderer.cs
public class MapViewRenderer : ViewRenderer<MapsUIView, Mapsui.UI.iOS.MapControl>
{
Mapsui.UI.iOS.MapControl mapNativeControl;
MapsUIView mapViewControl;
protected override void OnElementChanged(ElementChangedEventArgs<MapsUIView> e)
{
base.OnElementChanged(e);
if (mapViewControl == null && e.NewElement != null)
mapViewControl = e.NewElement;
if (mapNativeControl == null && mapViewControl != null)
{
var rectangle = mapViewControl.Bounds;
var rect = new CGRect(rectangle.X, rectangle.Y, rectangle.Width, rectangle.Height);
mapNativeControl = new Mapsui.UI.iOS.MapControl(rect)
{
Map = mapViewControl.NativeMap,
Frame = rect
};
SetNativeControl(mapNativeControl);
}
}
}
This is the base on how to implement the MapView in a Custom View Render in iOS, similiar code is needed for Android, and of course, the Custom Renderer itself, wich there is tons of tutorials on how to do it, like this ones: Source 1 Source 2
I want to create a Xamarin Forms Editor Control that changes its height when it gets filled(Adds a new line when space in previous line finished). I'm only interested in WinPhone and Android Platfroms.
The Editor itself doesn't support such property.
I know that the Android native control (EditText) supports it (Not sure about the WinPhone variant, TextBox). But I'm not sure how to implement it.
It will be very helpful if someone can explain me how to create the renderers for these platforms.
Edit
I found this partial solution, it kind of works fine but it is not so natural(as for example EditText in Android).
class RoundedEditor : Editor
{
public RoundedEditor()
{
this.TextChanged += (sender, e) => { this.InvalidateMeasure(); };
}
}
I'll be glad if someone will provide a better solution.
Edit 2
Here are the results of how it works now:
UWP
Writing first line:
pressing enter:
The previous line is not showed completely as I would like.
Android
In android it actually works great:
You will have to implement a custom Android EditText, and then use it for your XamarinForms control (by implementing a custom renderer for it)
Take a look at this implementation of resizable EditText:
https://github.com/ViksaaSkool/AutoFitEditText
You'd have to translate it to C# obviously, but its a great start point.
I created a Xamarin Forms app.
And inside a new page with a label named "MyLabel".
In the code behind for my page I have
private void SetUpUI()
{
#if __IOS__
this.MyLabel.BackgroundColor = Color.Navy;
#endif
}
In my iOS project options I can see symbol __IOS__ in the "Compiler" tab. (please see screenshot)
When I run in iOS it doesn't make the label blue:
But if I remove #if __IOS__ block it makes the label blue:
So it seems conditional compilation is not working.
I'm on a Mac. So couldn't test on Visual Studio.
Stuck with it for a long time but cannot figure out what I missed.
The answer of SushiHangover is correct: your PCL project won't have the compiler definitions for the platforms.
However, the solution he provides has become obsolete since Xamarin Forms 2.3.4 was released. Device.OnPlatform has been redesigned as discussed in this discussion and implemented in this Pull Request.
The correct way to do this in Xamarin Forms 2.3.4 and onwards is by using Device.RuntimePlatform. Use a switch or conditional to suit your needs like so:
if(Device.RuntimePlatform == Device.iOS)
{
// iOS
}
else if(Device.RuntimePlatform == Device.Android)
{
// Android
}
It would be possible to do it like you asked, if you were to use a shared project instead of a PCL. Because when you use a shared project, you have access to the compiler directives of your platform projects.
You are using the conditionals in your PCL project which would not contain those compiler defines, thus why your conditional code is greyed out.
In your PCL project you can use Device.OnPlatform to perform platform based processing:
Device.OnPlatform (iOS: () => this.MyLabel.BackgroundColor = Color.Navy; );
re: https://developer.xamarin.com/api/member/Xamarin.Forms.Device.OnPlatform/
Hi Xamarin/MvvmCross devs,
This is just a question out of curiosity. In one of the apps I'm developing some behaviour changed. Specifically on iOS when binding the UISwitch "On" value to a boolean in the ViewModel. The getter on the property fires when the binding is applied as well as the setter when the switch is flipped, but the UI does not reflect it. Forcing me to go from just
var set = this.CreateBindingSet<SettingsView, SettingsViewModel>();
set.Bind(PushNotificationSwitch).For(s => s.On)
.To(vm => vm.ReceivePushNotifications);
set.Apply();
To having to also add the following below that (to get the UI of the switch to reflect the value)
var settingsViewModel = ((SettingsViewModel)ViewModel);
PushNotificationSwitch.On = settingsViewModel.ReceivePushNotifications;
I left the binding, as well as the new code to reflect UI state, because in addition to the UI just reflecting the correct state, I also want it to change the state in my settingsService when the user changes it.
I recently upgraded through Xamarin Studio on Mac and my iOS Xam version is Version: 10.0.0.6. Unfortunately I didn't check what version I upgraded from, but I always upgrade as soon as I see there's one available, so it should be the previous stable version.
My questions are:
Has any of you experienced similar issues where bindings changed in this way?
Since the Android binding still works fine, do you think it's an issue in MvvmCross, or iOS Xamarin Changes
Any speculations as to what could be causing this? And other parts that you think this might affect, so I won't have to go scour for bugs if none exists. Commands, text and custom control bindings are working fine (as far as I've tested)
If this question would be better suited somewhere else please let me know, I'm just curious about this behaviour.
Thanks
As we worked out in the comments of the OP the event of the switch was linked out. Hence, the binding did nothing.
Easiest way to remedy this is to add the following code to your LinkerPleaseInclude.cs file, which MvvmCross provides in the Startup NuGet and through the templates available for Visual Studio and Xamarin Studio:
public void Include(UISwitch sw)
{
sw.On = !sw.On;
sw.ValueChanged += (sender, args) =>
{
sw.On = false;
};
}
This will tell the Linker that there is a direct usage of both the ValueChanged event and the On property, since the LinkerPleaseInclude class uses the Preserve attribute.
I am a developers from China, when I use GeckoFx, I encountered a problem.
I use GeckoFx version 22, when I use GeckoWebBrowser.DrawToBitmap method in Windows 7 64 bit environment, I can not get the snapshot,on get a gray box. If I use the normal WinForm control, there is no problem.
Hopefully someone will give you an answer for GeckoFX 22. There are two issues related to capturing images at the bitbucket site. Neither were resolved. It's possible that it just didn't work.
In case it is helpful, here's how we do it using GeckoFX 29:
private Image CreateImage(GeckoWebBrowser browser)
{
var creator = new ImageCreator(browser);
byte[] imageBytes = creator.CanvasGetPngImage((uint)browser.Width, (uint)browser.Height);
using (var stream = new MemoryStream(imageBytes))
{
return Image.FromStream(stream);
}
}
Looking at the source of ImageCreator class , I see there are now calls that would be simpler, like
ImageCreator.CapturePng(browser);