2017-10-22 3 views
0

하위 컨트롤을 "중첩"할 수있는 레이블과 자리 표시자를 포함하는 Xamarin Forms 사용자 정의 컨트롤을 만들려고합니다.Xamarin Forms Label 사용자 정의 컨트롤

왼쪽에 레이블이 있고 오른쪽에 중첩 컨트롤이 있어야합니다. 그들은 사용 가능한 공간의 비율을 차지할 필요가 있습니다. 즉 라벨은 3 분의 1, 중첩 된 컨트롤은 3 분의 2를 사용합니다. 내가 스택 레이아웃에 사용자 정의 컨트롤을 기반으로하는 경우 나는이

<userControls:PanelControl HeadingText="FIRST HEADING"> 
    <DatePicker /> 
</userControls:PanelControl> 

등 사용자 컨트롤을 사용할 수 있도록 자리로 콘텐츠 발표자를 사용하기 위해 노력하고있어

는 두 개의 컨트롤이 올바른에 표시 위치. 스택 레이아웃을 사용할 때의 문제는 퍼센트 너비를 구현할 수 없다는 것입니다.

Grid에서 사용자 정의 컨트롤을 기반으로하면 중첩 컨트롤이 레이블을 덮어 쓰는 첫 번째 열에 나타납니다. Content Presenter가 Grid에서 제대로 작동하지 않는 것 같습니다. 여기

는 모두 모양을 페이지

<?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:userControls="clr-namespace:BasicAppTemplate.UserControls;assembly=BasicAppTemplate" 
      x:Class="BasicAppTemplate.Pages.MainPage"> 

    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="*"/> 
     </Grid.RowDefinitions> 

     <userControls:PanelControl HeadingText="FIRST HEADING"> 
      <DatePicker /> 
     </userControls:PanelControl> 

     <userControls:PanelGridControl HeadingText="SECOND HEADING" Grid.Row="1"> 
      <DatePicker /> 
     </userControls:PanelGridControl> 
    </Grid> 

</ContentPage> 

이를

다음
<?xml version="1.0" encoding="UTF-8"?> 
<StackLayout xmlns="http://xamarin.com/schemas/2014/forms" 
      xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
      x:Class="BasicAppTemplate.UserControls.PanelControl" 
      Orientation="Horizontal"> 

    <Label x:Name="HeadingLabel" VerticalOptions="Center"/> 

    <ContentPresenter/> 

</StackLayout> 

는 그리드 기반의 사용자 제어 여기

<?xml version="1.0" encoding="UTF-8"?> 
<Grid xmlns="http://xamarin.com/schemas/2014/forms" 
      xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
      x:Class="BasicAppTemplate.UserControls.PanelGridControl"> 

    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> 
     <ColumnDefinition Width="2*"/> 
    </Grid.ColumnDefinitions> 

    <Label x:Name="HeadingLabel" VerticalOptions="Center" Grid.Column="0"/> 

    <StackLayout Grid.Column="1"> 
     <ContentPresenter/> 
    </StackLayout> 

</Grid> 

에게 인 스택 레이아웃 기반의 사용자 제어입니다

enter image description here

아이디어를 구현하는 방법은 무엇입니까? 중첩 된 사용자 정의 컨트롤을 만들 수있는 또 다른 방법이 있습니까?

+0

https://stackoverflow.com/questions/44948004/xamarin-forms-contentpresenter-goes- 내에서의 ControlTemplate을 포함하는 것입니다 in-wrong-row-on-phone-empty-on-ContentPresenter는 ControlTemplate 내부에서 사용하기위한 것입니다. – DavidS

+0

흥미로운 Hmmm. 그에게 고마워 할 것입니다. –

답변

0

감사 다비즈에서 포인터에 대한 해결책은이를 바탕으로 사용자 정의 컨트롤

<?xml version="1.0" encoding="UTF-8"?> 
<ContentView xmlns="http://xamarin.com/schemas/2014/forms" 
      xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
      x:Class="BasicAppTemplate.UserControls.PanelGridControl"> 

    <ContentView.ControlTemplate> 

     <ControlTemplate> 

      <Grid> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="*" /> 
        <ColumnDefinition Width="2*" /> 
       </Grid.ColumnDefinitions> 

       <Label VerticalOptions="Center" Grid.Column="0" Text="{TemplateBinding HeadingText}" /> 

       <ContentPresenter Grid.Column="1" /> 

      </Grid> 

     </ControlTemplate> 

    </ContentView.ControlTemplate> 

</ContentView>