Xamarin form: Tabbed Page Tabs not rendered properly on android - android

I have problem rendering the tabs in tabbedPage.
I have two tabs:
Tab 2:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Provider.Pages.SignInOut.ProjectFix.TestPage2"
Title="Accounted">
<ContentPage.Content>
<StackLayout><Label Text="asdf454545"></Label></StackLayout>
</ContentPage.Content>
Tab 1:
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Provider.Pages.SignInOut.ProjectFix.TestPage"
Title="Unaccounted">
<ContentPage.Content>
<StackLayout>
<Label Text="asdf"></Label>
</StackLayout>
</ContentPage.Content>
</ContentPage>
The tabbedPage which hosted those tabs is:
public class TestTabbedPage : TabbedPage
{
public TestTabbedPage()
{
Children.Add(new TestPage());
Children.Add(new TestPage2());
}
}
The problem i have here is it does show two tabs but the last tabs don't have the name included and the text was not on the screen
If I duplicate the page with Tab 1 instead of Tab 2, everything works fine.
What am i doing wrong with the tabs why does tab 2 not showing properly on the screen.
This actually giving me headache because I have actual project which have two tabs but when rendered the tabs was gone. In the same project, I have the other pages which have tabs but they all showing fine.

Related

Why won't my MarcTron Admob banner ad show?

I'm using Xamarin Forms in Visual Studio 2019. I have a simple grid layout with a banner ad in the bottom cell of the single column grid. This is my MainPage.xaml:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:controls="clr-namespace:MarcTron.Plugin.Controls;assembly=Plugin.MtAdmob"
x:Class="ShaarShamayim.MainPage">
<ContentPage.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="100"/>
</Grid.RowDefinitions>
.
.
.
<controls:MTAdView x:Name="myAds" Grid.Row="1" BackgroundColor="LightGray"></controls:MTAdView>
</Grid>
</ContentPage.Content>
</ContentPage>
My OnCreate in the Android MainActivity.cs looks like this:
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
Xamarin.Essentials.Platform.Init(this, savedInstanceState);
global::Xamarin.Forms.Forms.Init(this, savedInstanceState);
Plugin.CurrentActivity.CrossCurrentActivity.Current.Init(this, savedInstanceState);
MobileAds.Initialize(ApplicationContext);
LoadApplication(new App());
}
The AndroidManifest contains this:
<application android:label="ShaarShamayim.Android">
<meta-data android:name="com.google.android.gms.ads.APPLICATION_ID" android:value="ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy" />
</application>
And these are the NuGet packages I have installed:
MarcTron.AdMob 1.9.0.3
Xam.Plugin.Geolocator 4.5.0.6
Xamarin Essentials 1.6.1
Xamarin.Forms 5.0.0.2478
Xamarin.GooglePlayServices.Ads 120.3.0.3
According to everything I've seen online, this should result in a banner ad at the bottom of the screen. But there's nothing there. I set the background color of the ad to LightGray so that I could see if it's maybe being pushed off the page, and I get a big gray rectangle at the bottom of the screen.
So what am I doing wrong? Am I missing something obvious? The rest of the app works fine; it's just the ad. And there are no warnings or errors showing.
Thanks,
Lisa

Xamarin webview does not fill screen

I am currently creating a Xamarin Forms app that features a webview which has to cover my whole device screen.
Unfortunately I can not figure out how to do it, I always have a white bar underneath, is this a bug? I switched off my navbar, as I do not wan to show that.
I used the hybrid webview as explained here
I already tried using grid, stacklayout and absolute layout,
Update
Already tried ti set padding and margin to 0 in the layout and the webview, does not work either..
my current layout looks like this:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:controls="clr-namespace:EatyAndroidApp.Controls"
mc:Ignorable="d"
x:Class="EatyAndroidApp.CustomWebViewPage"
NavigationPage.HasNavigationBar="False"
NavigationPage.HasBackButton="False"
BackgroundColor="#313131">
<ContentPage.Content>
<StackLayout HorizontalOptions="Fill" VerticalOptions="Center">
<controls:HybridWebView
x:Name="hybridWebView"
BackgroundColor="#313131"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand"
/>
</StackLayout>
</ContentPage.Content>
</ContentPage>
which produces me this: (I blurred out the content)
Image
Thank you in advance
Ok, I figured it out, somehow, the webview was not aware of its height and width, I had to manually access it via Javascript and set the new Layout:
Inside
public override async void OnPageFinished(Android.Webkit.WebView view, string url)
just execute
view.EvaluateJavascript("document.documentElement.style.height = screen.height + 'px';", null);

Scroll to the bottom of the view of ScrollView programmatically in Nativescript

I am developing an app where when user click on cardview layout, detail of that view is opened on that card view layout. I have used nativescript ScrollView for scrolling the views. But, when user click on last cardview layout it should scroll to show detail of cardview layout. It does not automatically scrolls to the last card view detail, due to this the detail of the card view is hidden and user have to scroll manually.
I found this Nativescript scroll to bottom of ScrollView programmatically but i am not able to solve my problem. Below is my code for layout.
<ScrollView id="scrollView" #scrollView orientation="vertical" #scrollView (scroll)="onScroll($event)">
<StackLayout row="0" col="0">
<StackLayout *ngFor="let item of items" class="card-view" id="cardViewLayout">
<GridLayout columns="auto, *, auto" rows="auto,auto,auto" (tap)="toggleDetail(#event)">
</GridLayout>
<GridLayout row="3" col="0" colSpan="3" columns=" *, *" rows="auto,auto" id="detailedData" visibility="hidden" class="cardDetail">
<StackLayout row="0" col="0" class="detailDataStack">
</StackLayout>
</GridLayout>
</StackLayout>
</StackLayout>
</ScrollView>
toggleDetail(args){
var scrollView = this.page.getViewById("scrollView")
var offset = this.scrollView.nativeElement.scrollableHeight;
this.scrollView.nativeElement.scrollToVerticalOffset( this.scrollView.nativeElement.offset+ 120, false);
}
As shown in above when user click on card-view class layout, it is toggling cardDetail class. When there is last item in card-view it should scroll automatically to show the details but it don't automatically scrolls.
In toggleDetail() method i tried to get scrollableHeight, add 120 to that height and make it scroll when user in last item but nothing happened.
Playground Sample app for this
ScrollView Sample app Nativescript Playground
Thank you in advance :)
You are suppose to use verticalOffset not just offset.
this.scrollView.nativeElement.scrollToVerticalOffset(this.scrollView.nativeElement.verticalOffset + 120, false);
just use scrollToVerticalOffset and scrollableHeight
const scrollView = page.getViewById('scroll-view');
scrollView.scrollToVerticalOffset(scrollView.scrollableHeight, true);

Updating MasterDetailPage's Header on Android using Prism for Xamarin Forms

I have a MasterDetailPage (called RootPage) and ContentPage (called MainPage).ContentPage's Title property is set to 'This is main page' and I am navigating using NavigationService with the following code:
await navigationService.NavigateAsync("RootPage/MainPage");
What I expect to see is ContentPage's Title in the MasterDetail's header, but it says 'MainActivity' everytime.
Is this some kind of a platform behavior? If not, how do I set the MasterDetailPage's header to a specific object?
In our app the title of the pages is set correctly in the 'header' of the MasterDetail. Upon starting we navigate like this:
NavigationService.Navigate("RootPage/DetailsNavigationPage/MainPage")
When navigating modeless further down, the new pages are also loaded in the 'details' of the MasterDetail and their title is displayed:
NavigationService.Navigate("AnotherPage", null, false);
The DetailsNavigation page is a simple page that looks like this:
<?xml version="1.0" encoding="utf-8" ?>
<NavigationPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
prism:ViewModelLocator.AutowireViewModel="True"
x:Class="SomeNameSpage.Views.DetailsNavigationPage"
BarBackgroundColor="Accent">
</NavigationPage>
And the MasterDetail looks like this:
<?xml version="1.0" encoding="utf-8" ?>
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
prism:ViewModelLocator.AutowireViewModel="True"
x:Class="SomeNameSpace.Views.RootPage">
<MasterDetailPage.Master>
<ContentPage Title="Default"><!--Must have a Title, otherwise crashes according to https://developer.xamarin.com/guides/xamarin-forms/user-interface/navigation/master-detail-page/-->
<StackLayout>
<Button Text="Main Page" Command="{Binding NavigateCommand}" CommandParameter="DetailsNavigation/MainPage" />
<Button Text="Some Page" Command="{Binding NavigateCommand}" CommandParameter="DetailsNavigation/SomePage" />
</StackLayout>
</ContentPage>
</MasterDetailPage.Master>
</MasterDetailPage>

Android VideoView Overlapping

I have two pages in Xamarin Forms using a custom renderer to display an Android VideoView on each page. The video on Page1 (nested inside of a RelativeLayout) plays successfully. When I navigate from Page1 to Page2 using Navigation.PushAsync(Page2); the VideoView from Page1 continues to overlap the video on Page2.
Is there a way to force the VideoView to respect the visibility of its parent view container?
Page1.xaml:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="MyVideoApp.Page1">
<RelativeLayout>
<MyVideoView x:Name="vidPlayer" Source="http://...."
RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width}"
RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height}" />
</RelativeLayout>
</ContentPage>
Page2.xaml:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="MyVideoApp.Page2">
<MyVideoView x:Name="vidPlayer" Source="http://...." />
</ContentPage>
The VideoView is a SurfaceView and SurfaceViews Z-order are determined before being attached to a window and cannot be changed afterwards. So you cannot have multiple SurfaceViews showing at the same time since the SurfaceView kind of shows through anything and everything.
You may need to try removing the VideoView completely and re-adding it later or, if all else fails, you could try moving the VideoView off of the screen.
Source

Categories

Resources