프로그래밍

자마린,WPF 2중 바인딩 어떻게 해?

목표는 CollectionView 안에 CollectionView를 하나 더 넣으려고 함

WPF를 기준으로 말하자면 ItemsControl 안에 ItemsControl을 넣는거임

 

 

 

 

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<StackLayout Padding="24,24,24,40" Spacing="32">
                                <CollectionView ItemsSource="{Binding CategoryItems}">
                                    <CollectionView.ItemsLayout>
                                        <LinearItemsLayout Orientation="Vertical" ItemSpacing="7" />
                                    </CollectionView.ItemsLayout>
                                    <CollectionView.ItemTemplate>
                                        <DataTemplate>
                                            <Label x:Name="CategoryName" Text="{x:Binding item1, Mode=TwoWay, UpdateSourceEventName=PropertyChanged}" FontFamily="NotoSansBold" FontSize="18" TextColor="#222222" Margin="0,0,0,1"/>
                                        </DataTemplate>
                                    </CollectionView.ItemTemplate>
                                    <CollectionView ItemsSource="{x:Binding item2}">
                                        <CollectionView.ItemTemplate>
                                            <DataTemplate>
                                                <Label x:Name="MenuName" Text="{x:Binding item2}">
                                                    <Label.GestureRecognizers>
                                                        <TapGestureRecognizer Command="{Binding MenuCommand}" CommandParameter="{x:Binding item1}"/>
                                                    </Label.GestureRecognizers>
                                                </Label>
                                            </DataTemplate>
                                        </CollectionView.ItemTemplate>
                                    </CollectionView>
                                </CollectionView>
cs

 

 

 

 

1
public ObservableCollection<Tuple<string, ObservableCollection<Tuple<stringstring>>>> firstObservable;
cs

 

비하인드 코드를 보면 이중 ObservableCollection 형태인데

firstObservable.item1은 'CategoryName'에 넣고

firstObservable.item2.item2는 'MenuName'에 넣고 싶은데... 두번째 CollectionView를 어디에 넣든 오류가 발생해서 넣지를 못하고 있음 ㅜㅜ

그리고 CollectionView 안에 있는 Command가 바인딩이 안되는데 어떻게 하는지 아는 사람이 있다면 알려줘!!

 

 

 

 

 

 

10개의 댓글

ye
2023.07.24

일단 이런식으로 복잡해지면 구조를 재설계하는걸 추천드리고

 

일단 Item1이 Category로 그 밑에 Collection을 표시하고 싶어하시는거같은데

<DataTemplate>

....<Label Text="{x:Binding Item1}"/>

....<CollectionView ItemsSource="{x:Binding Item2}">

........<CollectionView.ItemTemplate>

............<DataTemplate>

................<!-- MenuName을 표시할 DataTemplate -->

............</DataTemplate>

........</CollectionView.ItemTemplate>

....</CollectionView>

</DataTemplate>

 

이런식으로 하나의 DataTemplate에 다 묶어두시는게 맞습니다.

 

첫 째, 대충 보니까 Category를 Label로 위에 표시하고 아래에 있는 메뉴들을 리스트로 표시하고 싶으신거 맞죠?

이럴 때는 이렇게 직접 구현하는 것도 좋은데 CollectionView에서 Grouping을 기본적으로 제공하는 것 같으니까 Model 클래스를 설계해서 넣는걸 추천드려요. 아니 Grouping 없어도 이런식이면 생 variable로 떼우지말고 model 설계하세요

 

둘 째, DataTemplate 작성할때 웬만하면 model 클래스 만들어서 DataType으로 지정해줌으로써 실수를 줄여보시는걸 추천드려요. DataType 지정해주면 IDE에서 Binding 할 때 IntelliSense 돌거덩요

0
ye
2023.07.24
@ye

class MenuCategory

{

....string Name {get;set;}

....ObservableCollection<MenuItem> MenuItems {get;set;}

}

 

class MenuItem

{

....string name {get;set;}

....ICommand MenuCommand => new Command<object>((param) => {});

}

 

그리고 ObservableCollection<MenuCategory> Menus; 를 ViewModel에 선언해서 사용하면 되겠죠?

0
ye
2023.07.24
@ye

Group 헤더 템플릿은 CollectionView.GroupHeaderTemplate 에 선언하면 되네요

0
2023.07.24
@ye

일단... 써주신 방법으로는 "DataTemplateContent가 두 번 이상 설정되었습니다."라고 에러가 발생합니다.

<CollectionView.ItemTemplate>

<DataTemplate>

<Label Text="{x:Binding item1, Mode=TwoWay, UpdateSourceEventName=PropertyChanged}"/>

<CollectionView ItemsSource="{x:Binding item2}">

<CollectionView.ItemTemplate>

<DataTemplate>

<Label Text="{x:Binding item2}">

<Label.GestureRecognizers>

<TapGestureRecognizer Command="{Binding MenuCommand}" CommandParameter="{x:Binding item1}"/>

</Label.GestureRecognizers>

</Label>

</DataTemplate>

</CollectionView.ItemTemplate>

</CollectionView>

</DataTemplate>

</CollectionView.ItemTemplate>

작성은 이런 식으로 했습니다.

 

사실 모델로 작성할까도 생각해봤는데 데이터가 낏해봐야 3개밖에 없어서 걍 쌩으로 ObsavableCollection을 사용했습니다.

0
ye
2023.07.24
@집에가게해줘

당연히 Content가 두번 이상 설정돼죠! Label하고 CollectionView가 선언되었으니까요!

WPF에서 Panel이나 Grid로 감싸는 것처럼 처리해주셔야합니다. ItemsLayout에서 선언하신건 하나의 DataTemplate을 표현해서 어떻게 layout을 구성할것인가 선언한것이니까 DataTemplate에 의해 표현될 영역도 예외는 아닙니다

0
2023.07.24
@ye

아!!! 그쵸....... Grid나 StackLayout 같은걸로 감싸면 되는건데............. 이걸........ ㅋㅋㅋㅋㅋㅋㅋㅋ

C#은 시작한지 얼마 안돼서.. ㅋㅋㅋㅋ 감사합니다!

0
2023.07.24
@ye

아 방금 막 생각난건데 CollectionView에 바인딩한 Label에 위 처럼 GestureRecognizers 사용해서 command 주면

다른 일반 적인 커맨드들 하고는 다르게 바인딩이 안 먹히는거 같은데.. 이것도 이유를 알 수 있을까요?

구글링 해보면 다들 mvvm 구조가 아니라 그냥 ~.xaml.cs에서 x:Name에 직접 접근해서 넣어버리는 걸 알려주더라구요.

mvvm에서는 viemodel에서 view에 있는 x:Name에 다이렉트 접근이 불가능한데... ㅜㅜ

0
ye
2023.07.24
@집에가게해줘

MenuCommand가 ViewModel에 선언된거죠? 그럼 ViewModel이 BindingContext인 Element에(보통은 Window 그자체가 되겠죠 자마린에서는 ContentView?ContentPage?) x:name을 선언하고 Binding 옵션 Source에 해당 name을 가진 Element를 지정해주면 해당 Element의 BindingContext(ViewModel 이겠죠?) 로부터 MenuCommand를 찾기 때문에 정상적으로 찾아올겁니다.

 

https://stackoverflow.com/questions/49507092/relative-source-binding-xamarin

 

------------

 

좀더 정확히 말해서 현재 TapGestureRecognizer의 BindingContext(DataContext)는 DataTemplate내에 선언되었기 때문에 최상위 CollectionView에 지정된 ItemsSource 속 하나의 Element가 됩니다. 즉, Tuple<string, ObservableCollection<Tuple<string, string>>> 이 DataTemplate 내 Element의 BindingContext가 됩니다.

 

강제로 다른 Element의 bindingCOntext를 source로 지정하는 방법이라고 보시면 됩니다

0
2023.07.25

님아 님 지금 Prism을 이해를 몬하구 있음... Brian lagunus 유튜브에 outlook 클론 강의보고하셈

0
2023.07.25
@좋소사장

뭔가 간단한 핵심 요약같은 강의인줄 알았는데 너무..... 헤비한걸? ㅋㅋㅋㅋ

0
무분별한 사용은 차단될 수 있습니다.
번호 제목 글쓴이 추천 수 날짜 조회 수
5719 [프로그래밍] 하이브리드 웹뷰기반 앱은 rn이 정석이야? 3 잠적자 0 21 시간 전 164
5718 [프로그래밍] c# webview2 도움요청함.. 7 carpediem 0 1 일 전 120
5717 [프로그래밍] 현업 개발자형들 맥씀? 9 이또히로부미 0 1 일 전 219
5716 [프로그래밍] libtorch에서 cuda 안불러와지는거 도움! 2 Hakat 0 2 일 전 125
5715 [프로그래밍] 뭔가 게시판이 애매해서 그런데 gis 잘아는 사람? 1 하늘늑대 0 3 일 전 164
5714 [프로그래밍] 컴포즈가 프리뷰랑 폰에서 다르게 동작해요 1 집에가게해줘 0 3 일 전 118
5713 [프로그래밍] 난바보다) 크로미움 램사용량 문제 일단 해결 2 ye 0 5 일 전 284
5712 [프로그래밍] k8s DNS 이슈는 해결이 안되나보다. 잉텔 0 5 일 전 171
5711 [프로그래밍] 분노) 진짜 유튜브 구글 패악질 토나오네 씨발 17 ye 0 7 일 전 770
5710 [프로그래밍] 프론트엔드 공부하려는데 언어 추천좀 7 스트리플 0 7 일 전 352
5709 [프로그래밍] 객체지향 뽕에 취하지마라 8 69746974 2 8 일 전 409
5708 [프로그래밍] 요즘 앱개발 인력시장 어떰..3년차 2 센치해요 0 11 일 전 388
5707 [프로그래밍] 컴포즈 Box 컴포넌트가 안 나와... 1 집에가게해줘 0 13 일 전 148
5706 [프로그래밍] 아 ssl 적용햇는데 개정신없네 9 넌또화나있네 0 13 일 전 305
5705 [프로그래밍] 패스트 캠퍼스 <---- 얘내는 가격 인상 원툴임? 5 조강현 0 16 일 전 398
5704 [프로그래밍] 클라가 파이썬 셀레니움같은거 써서 클릭하고 그러는걸 감지 ... 5 리옴므 0 17 일 전 266
5703 [프로그래밍] leetcode 50일 달성 1 JimmyMcGill 1 17 일 전 237
5702 [프로그래밍] 그냥 개인공부용 git 만들건데 5 년째재수강 0 17 일 전 336
5701 [프로그래밍] html 자바스크립트 질문 19 책걸이 0 18 일 전 370
5700 [프로그래밍] 아니 시바 이게 무슨일이야 4 인간지표 0 19 일 전 380