Forum Xamarin.Forms
We are excited to announce that the Xamarin Forums are moving to the new Microsoft Q&A experience. Q&A is the home for technical questions and answers at across all products at Microsoft now including Xamarin!

We encourage you to head over to Microsoft Q&A for .NET for posting new questions and get involved today.

ContentView controls not working - why?

MisterAcousticMisterAcoustic Member ✭✭
edited September 1 in Xamarin.Forms

I am trying to create a control using a ContentView, and I don't understand why my controls (button and entry for testing) are not clickable.

Here is the XAML for the control:

<?xml version="1.0" encoding="UTF-8"?>
<ContentView 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:E2Mobile="clr-namespace:E2Mobile"
             mc:Ignorable="d"
             x:Class="E2Mobile.Selector"
             IsVisible="True">
  <ContentView.Content>
        <Frame x:Name="SelectorFrame" Padding="0" CornerRadius="0" IsClippedToBounds="True" BackgroundColor="Red" Margin="0" IsVisible="False">
            <StackLayout Orientation="Vertical">
                <Button x:Name="TheButton" Clicked="ButtonClick" Text="ClickMe" IsEnabled="True"></Button>
                <Entry x:Name="myentry" Placeholder="asdf"></Entry>
            </StackLayout>
        </Frame>
    </ContentView.Content>
</ContentView>

And the code for the control:

using System;
using System.Collections.Generic;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;

namespace E2Mobile
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class Selector : ContentView
    {
        public Selector()
        {
            InitializeComponent();
        }

        public void ButtonClick(object sender, EventArgs e)
        {
            TheButton.Text = "clicked";
        }

        public void Show(VisualElement callingElement = null)
        {
            this.IsVisible = true;
            SelectorFrame.IsVisible = true;
        }
    }
}

When the page the control is on calls Show(), the UI appears (I also ensure no other elements are covering the control), but neither the button nor the Entry respond to any tap at all - the button doesn't highlight, tapping the Entry does not bring up the keyboard.

I know I'm missing something simple, but it's eluding me. Any help is appreciated

Thanks!

Best Answer

Answers

  • jezhjezh Member, Xamarin Team Xamurai

    I don't understand why my controls (button and entry for testing) are not clickable.

    I created a new app and added your code to the new app, it just works properly.

    If it is convenient for you, could you please post a basic demo so that we can try to reproduce this question on our side?

  • MisterAcousticMisterAcoustic Member ✭✭
    edited September 1

    Hi jezh,

    Thank you very much for looking at this. I encountered this problem in an app that I'm working on, and before I posted here, I created an entirely new app with the same code, and it has the same behavior.

    Curious :).

    Please find my simple demo attached. I appreciate your help.

    Edit: Visual Studio 16.6.2, Xamarin Forms 4.5.0.495

  • igorkr_10igorkr_10 Member ✭✭✭✭
    edited September 1

    About custom control.

    Your control doesn't need to know about other controls. Creating a method public void Show(VisualElement callingElement = null) is a wrong way.

    What does your control must do? Select something? Why do you create show/hide functionality if your ContentView already has a IsVisible property?

    You can do this in your Page:

    <E2Mobile:Selector Grid.Row="0" x:Name="TestSelector" HideCallingElement="true" IsVisible="False"></E2Mobile:Selector>
                <Button Grid.Row="1" x:Name="TestSelectorButton" Text="Select..." Clicked="OpenTestSelector"></Button>
    
    public void OpenTestSelector(object sender, EventArgs e)
            {
                TestSelector.IsVisible = true;
                TestSelectorButton.IsVisible = false;
                //TestSelector.Show(TestSelectorButton);
            }
    

    There will be same effect.

    Also you don't need to implement INotifyPropertyChanged in your page because it is already implemented in BindableObject class.

    If you need something to hide/expand content take a look on Expander

  • MisterAcousticMisterAcoustic Member ✭✭

    Hi igorkr_10
    Thank you very much - I certainly knew that the grids were out of whack - the initial code was copied from a much more complicated page, and I didn't bother to fix that up. What I failed to notice was the StackLayout was taking the same space - I think I just went blind from looking at it. It's all clear now.

    I am aware that INotifiyPropertyChange should not be needed - was just grasping at straws and left that in.

    Regarding the control, yes, it will allow items to be selected from a list - but of course it's not that simple :). I will likely remove the reference to the calling element - you're right, the control shouldn't know about that.

    I appreciate your help, and should be good to go from here.

    Thanks!

  • jezhjezh Member, Xamarin Team Xamurai

    Yes, the Grid in your Page1 is wrong, just as igorkr_10 said.

    For how to use Grid, you can check the official document:Xamarin.Forms Grid

    To achieve above funtion, you can refer to the following code:

            <Grid x:Name="PopupGrid" Grid.Row="1" BackgroundColor="#F0F1F2" VerticalOptions="Fill" RowSpacing="0" Margin="0" Padding="0" >
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>
    
                    <E2Mobile:Selector Grid.Row="0"  Grid.Column="0"   x:Name="TestSelector"   ></E2Mobile:Selector>
                    <StackLayout Grid.Row="1"  Grid.Column="0" >
                        <Button x:Name="TestSelectorButton" Text="Select..." Clicked="OpenTestSelector"></Button>
                    </StackLayout>
    
            </Grid>
    

    The result is:

  • jezhjezh Member, Xamarin Team Xamurai

    Hi @MisterAcoustic , have you resolved your question?

  • MisterAcousticMisterAcoustic Member ✭✭

    Hi @jezh - yes, all taken care of, thanks to all.

Sign In or Register to comment.