how to add a click event for entry which is in disable state?
I tried with gesture recognizer like below:
<Entry
TextColor="Black"
x:Name="phone">
<Entry.GestureRecognizers>
<TapGestureRecognizer
Tapped="StartCall"
NumberOfTapsRequired="1">
</TapGestureRecognizer>
</Entry.GestureRecognizers>
</Entry>
void StartCall(object sender,EventArgs args)
{
DisplayAlert("Alert","Hi","ok");
}
No alert showing on ui when tapping on entry.
Thanks in advance
Put your entry inside layout and give GestureRecognizers to layout.
e.g
<StackLayout>
<Entry
Placeholder="Enter Phone Number"
IsEnabled="False"
TextColor="Black"
x:Name="phone"/>
<StackLayout.GestureRecognizers>
<TapGestureRecognizer
Tapped="StartCall"
NumberOfTapsRequired="1">
</TapGestureRecognizer>
</StackLayout.GestureRecognizers>
</StackLayout>
Just Put your Button in a Layout(StackLayout for example) that handles your Event
<StackLayout>
<StackLayout.GestureRecognizers>
<TapGestureRecognizer
Tapped="StartCall">
</TapGestureRecognizer>
</StackLayout.GestureRecognizers>
<!-- InputTransparent="True" to avoid conflicts -->
<Entry InputTransparent="True"
TextColor="Black"
x:Name="phone"/>
<StackLayout>
As #Diego Rafael Souza said
Entry having Focused event it will fire while user tap on Entry
XAML:
<Entry Placeholder="Phone number" TextColor="Black" x:Name="phone" Focused="StartCall"/>
.cs:
void StartCall(object sender, EventArgs args){
DisplayAlert("Alert", "Hi", "ok");
}
Put it in a grid layout
<Grid>
<Entry IsEnabled="False" Text="Hello"/>
<StackLayout>
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Command="{Binding EntryTapCommand}" />
</StackLayout.GestureRecognizers>
</StackLayout>
</Grid>
Related
I have a content page with the following data template for RadioButtons:
<DataTemplate x:Key="RadioTemplate">
<StackLayout Padding="0,2,0,0">
<StackLayout
Orientation="Horizontal" >
<Label
Text="{Binding Title}"
Style="{StaticResource LabelStyle}">
</Label>
<ImageButton HorizontalOptions="Center"
CornerRadius="6"
VerticalOptions="Center"
Clicked="HelpButton_Clicked"
HeightRequest="12"
WidthRequest="12"
BorderColor="Black"
BackgroundColor="Black"
BorderWidth="1"
IsVisible="{Binding ShowHelpButton}">
<ImageButton.Source>
<FontImageSource FontFamily="FAFreeSolid"
Color="White"
Glyph="{x:Static fa:FontAwesomeIcons.Question}"/>
</ImageButton.Source>
</ImageButton>
</StackLayout>
<Label
Style="{StaticResource HelpStyle}"
Text="{Binding HelpTopic.Text}"
IsVisible="{Binding HelpTopic.IsVisible, Mode=TwoWay}">
</Label>
<StackLayout
RadioButtonGroup.GroupName="{Binding ChoiceList.Code}"
RadioButtonGroup.SelectedValue="{Binding Value}"
BindableLayout.ItemsSource="{Binding ChoiceList.Choices}"
BindableLayout.EmptyView="No choices available"
Orientation="Horizontal"
Margin="10,0,0,0">
<BindableLayout.ItemTemplate>
<DataTemplate>
<RadioButton Value="{Binding Value}"
Content="{Binding Label}"
IsChecked="{Binding IsSelected}"
CheckedChanged="OnRadioChanged"
FlowDirection="LeftToRight">
</RadioButton>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
</StackLayout>
</DataTemplate>
It is called from a collection view on the content page:
<StackLayout>
<Frame BackgroundColor="#2196F3" Padding="24" CornerRadius="0">
<StackLayout>
<StackLayout Orientation="Horizontal">
<Label
Text="Work Order Request"
HorizontalTextAlignment="Start"
HorizontalOptions="StartAndExpand"
VerticalTextAlignment="Center"
TextColor="White"
FontSize="Large"/>
<Button Text="Back" Clicked="BackButton_Clicked" HorizontalOptions="End" />
</StackLayout>
<Label
Padding="0,2,0,0"
Text="Verify your data before submitting"
HorizontalTextAlignment="Start"
TextColor="White"
FontSize="Micro" />
</StackLayout>
</Frame>
<Label
Margin="10,0,0,0"
Grid.Column="0"
Text="SOME TEXT HERE"
HorizontalOptions="Start"
FontSize="Micro"/>
<CollectionView
ItemsSource="{Binding MainPageView.Fields}"
EmptyView="No fields for this screen."
ItemTemplate="{StaticResource templateSelector}"
SelectionChanged="CollectionView_SelectionChanged">
</CollectionView>
<StackLayout Margin="10,0,10,5" Orientation="Vertical">
<Button Command="{Binding MainPageView.SubmitCommand}" Text="Submit" />
<validator:ErrorSummaryView
IsVisible="{Binding MainPageView.ShowValidationSummary, Mode=OneWay}"
ErrorStateManager="{Binding MainPageView.ErrorStateManager, Mode=OneWay}"
Margin="0,0,0,5"/>
</StackLayout>
</StackLayout>
If I have the App.xaml.cs instantiate the view directly, it displays fine:
public App()
{
InitializeComponent();
MainPage = new MainPage(false);
}
However, if I change and add a landing page that has a button to redirect to that page:
<?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="Test.Ui.Dashboard">
<ContentPage.Content>
<StackLayout>
<Frame BackgroundColor="#2196F3" Padding="24" CornerRadius="0">
<StackLayout>
<Label
Text="TEST DASHBOARD"
HorizontalTextAlignment="Start"
VerticalTextAlignment="Center"
TextColor="White"
FontSize="Large"/>
<Label
Padding="0,2,0,0"
Text="Sample UI/UX Pages"
HorizontalTextAlignment="Start"
TextColor="White"
FontSize="Micro" />
</StackLayout>
</Frame>
<StackLayout Orientation="Horizontal">
<Button Text="Work Order" Clicked="WorkOrder_Clicked" HorizontalOptions="FillAndExpand" BackgroundColor="#2196F3" TextColor="White" FontAttributes="Bold" FontSize="Large" CornerRadius="10"/>
<Button Text="Randomized Field Order" Clicked="Randomized_Clicked" HorizontalOptions="FillAndExpand" BackgroundColor="#2196F3" TextColor="White" FontAttributes="Bold" FontSize="Large" CornerRadius="10" />
</StackLayout>
</StackLayout>
</ContentPage.Content>
</ContentPage>
using System;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
namespace Test.Ui
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class Dashboard : ContentPage
{
public Dashboard()
{
InitializeComponent();
}
private void WorkOrder_Clicked(object sender, EventArgs e)
{
Navigation.PushAsync(new MainPage(false));
}
private void Randomized_Clicked(object sender, EventArgs e)
{
Navigation.PushAsync(new MainPage(true));
}
}
}
and change App.xaml.cs to
using Xamarin.Forms;
namespace Test.Ui
{
public partial class App : Application
{
public App()
{
InitializeComponent();
MainPage = new NavigationPage( new Dashboard());
}
protected override void OnStart()
{
// load up the style xaml files here
}
protected override void OnSleep()
{
}
protected override void OnResume()
{
}
}
}
Now, when I click the Work Order button, the radio options aren't displayed. If I change the stacklayout for the radio options to veritical orientation, they do. So the data is there but the view isn't able to render when I'm in a NavigationPage. Thoughts? I'd really like to have my radio buttons be horizontal when there aren't many choices.
Thanks
In my data template, I had to add an explicit WidthRequest = 150
<StackLayout
RadioButtonGroup.GroupName="{Binding ChoiceList.Code}"
RadioButtonGroup.SelectedValue="{Binding Value}"
BindableLayout.ItemsSource="{Binding ChoiceList.Choices}"
BindableLayout.EmptyView="No choices available"
Orientation="Horizontal"
Margin="10,0,0,0">
<BindableLayout.ItemTemplate>
<DataTemplate>
<RadioButton Value="{Binding Value}"
Content="{Binding Label}"
IsChecked="{Binding IsSelected}"
VerticalOptions="Center"
IsClippedToBounds="False"
HeightRequest="27"
WidthRequest="150"
CheckedChanged="OnRadioChanged">
</RadioButton>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
I guess the StackLayout wasn't able to calculate how wide to make each one. Will see if I can figure out a different way to do it so it adjusts for the width of the content.
I'm trying to get the string value of a selected item from the search bar. If to select Apple, then to get as string the value "Apple".
I have tried to use SearchButtonPressed but is not working at all. This is my code for the search bar.
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
x:Class="Sim.Views.MainPage"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
Title="Main Page">
<ContentPage.Content>
<Grid BackgroundColor="DarkGray">
<StackLayout Margin="10"
VerticalOptions="Start"
HorizontalOptions="Start">
<SearchBar x:Name="searchBar"
HorizontalOptions="Fill"
VerticalOptions="StartAndExpand"
Placeholder="Search Access Points..."
CancelButtonColor="Orange"
PlaceholderColor="Orange"
TextTransform="Lowercase"
HorizontalTextAlignment="Start"
TextChanged="OnTextChanged"
/>
<Label Text="Type in the searchbox."
HorizontalOptions="Fill"
VerticalOptions="CenterAndExpand" />
<ListView x:Name="searchResults"
HorizontalOptions="Fill"
VerticalOptions="CenterAndExpand"
IsVisible="False"/>
</StackLayout>
</Grid>
</ContentPage.Content>
</ContentPage>
I solved this issue by adding ItemTapped
<ListView x:Name="searchResults"
HorizontalOptions="Fill"
VerticalOptions="CenterAndExpand"
ItemTapped ="GetTappedItem"/>
void GetTappedItem(object sender, ItemTappedEventArgs e)
{
var details = e.Item;
}
Thank you #Jason.
Xamarin iOS application infinitely suspended when CollectionView.IsVisible = false on start up.
on Android, It works. However, on iOS, setting CollectionView.IsVisible = false resulted in application freezed.
<StackLayout
Margin="0,20,0,0">
<Button
HorizontalOptions="CenterAndExpand"
WidthRequest="100"
Clicked="Button_Clicked"
Text="Click Me"/>
<CollectionView
x:Name="Collection"
VerticalOptions="FillAndExpand"
ItemsSource="{Binding Items}"
SelectionMode="Single"
IsVisible="False">
<CollectionView.ItemsLayout>
<GridItemsLayout
Orientation="Vertical"
Span="4"/>
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout
Margin="10,10,10,10">
<Image
WidthRequest="50"
HeightRequest="50"
Source="{local:ImageResource CollectionView.Image.png}"/>
<Label
Text="{Binding Title}"
HorizontalTextAlignment="Center"
VerticalTextAlignment="Center" />
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>
Here is reproducible project.
There is a workaround to solve this for iOS, you could set Visiable of CollectionView after Layout is initialized.
For example, remove IsVisible="False" from Xaml, then set it in ContentPage.cs in OnAppearing method:
protected override void OnAppearing()
{
base.OnAppearing();
Collection.IsVisible = false;
}
The effect:
Latest Xamarin on Mac as of writing:
<ContentPage.Content>
<StackLayout>
<ListView x:Name="ItemsListView" ItemsSource="{Binding Items}" VerticalOptions="FillAndExpand" HasUnevenRows="true" RefreshCommand="{Binding LoadItemsCommand}" IsPullToRefreshEnabled="true" IsRefreshing="{Binding IsBusy, Mode=OneWay}" CachingStrategy="RecycleElement" ItemSelected="OnItemSelected">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Horizontal">
<StackLayout Padding="10">
<Label Text="{Binding Summary}" LineBreakMode="NoWrap" Style="{DynamicResource ListItemTextStyle}" FontSize="Medium" />
<Label Text="{Binding Reporter}" LineBreakMode="NoWrap" Style="{DynamicResource ListItemDetailTextStyle}" FontSize="Micro" />
</StackLayout>
<StackLayout Orientation="Horizontal" HorizontalOptions="EndAndExpand">
<Label Text="{Binding Start}" FontSize="Medium" VerticalOptions="Center"/>
<Switch IsToggled="{Binding Result}" Toggled="Handle_Toggled" VerticalOptions="Center"/>
</StackLayout>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage.Content>
How do I get the bound item to a Switch control in a ListView. The item is in the list of items bound to the ListView, provided by the ViewModel. You can 'switch' the item's toggle without selecting the row.
void Handle_Toggled(object sender, Xamarin.Forms.ToggledEventArgs e)
{
// In this event handler, how do I get the bound item from the ListView??
}
Normally, what you'd need to do, is to react to the changes of property "Result" in your item class, and keep your logic out of the Page class.
If you need to handle in the event, you can do it this way:
void Handle_Toggled(object sender, Xamarin.Forms.ToggledEventArgs e)
{
var switch = sender as Switch;
var item = switch.Parent.BindingContext as ItemViewModel;
}
Replace ItemViewModel by your item's type.
Im trying to show an Overlay with an activityIndicator by clicking an custom sync button in the toolbar. The Button makes an API call to get datas from my backend.
Im using Xamarin forms with the Prism Plugin
This is my MasterDetailPage Xaml
<MasterDetailPage.ToolbarItems >
<ToolbarItem Command="{Binding SyncCommand}" Icon="sync32.png">
</ToolbarItem>
</MasterDetailPage.ToolbarItems>
<MasterDetailPage.Master >
<ContentPage Title="Default"
BackgroundColor="Gray">
<StackLayout Padding="0,60,0,0">
<ListView x:Name="Menu"
VerticalOptions="FillAndExpand"
HorizontalOptions="Fill"
ItemsSource="{Binding Items}"
SeparatorVisibility="None">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout MinimumHeightRequest="48"
Orientation="Horizontal"
Spacing="40">
<Label Text="{Binding TitleKey}"
TextColor="White"
FontSize="20"
VerticalOptions="Center"/>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.Behaviors>
<behaviors:ListViewItemSelectedBehavior Command="{Binding ChangePageCommand }"/>
</ListView.Behaviors>
</ListView>
</StackLayout>
</ContentPage>
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<ContentPage>
<AbsoluteLayout
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand">
<ActivityIndicator
Color="#69d2e7"
RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
Property=Height,
Factor=0.33}"
RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
Property=Height,
Factor=0.33}"
IsVisible="{Binding IsBusy}"
IsRunning="{Binding IsBusy}"
/>
</AbsoluteLayout>
</ContentPage>
</MasterDetailPage.Detail>
This is my MasterDetail xaml cs
public SMasterDetail()
{
InitializeComponent();
Menu.ItemSelected += async (s, e) =>
{
Menu.SelectedItem = null;
IsPresented = false;
await Task.Delay(200);
};
}
When im clicking on The Sync button in the toolbar the ViewModel gets the datas from the backend and populate an ObservableCollection. Im setting IsBusy to true and after that to false.
But I cant see the overlay. Is their any solution how to show the activityIndicator overlay on each page by clicking the sync button?