2015-03-31 17 views
16

Có cách nào để thực hiện phân đoạn phương thức, làm hiển thị chế độ xem và điều hướng lên từ dưới cùng, bao gồm thanh điều hướng, chế độ xem và thanh tab hiện có, v.v. không?Làm cách nào để tạo chế độ xem phương thức tìm kiếm bản địa tách biệt với phản ứng gốc?

Có một ví dụ tương tự trong UIExplorer nơi chế độ xem 'Navigator' sử dụng 'configureScene' để đặt chế độ xem (nhưng không phải thanh điều hướng) từ dưới qua Navigator.SceneConfigs.FloatFromBottom, v.v. tạo hiệu ứng cho thanh điều hướng mới và xem từ dưới cùng. Lưu ý: Ví dụ điển hình là ứng dụng y tế, nhấp vào tab 'ID y tế', sau đó nhấn vào nút 'Chỉnh sửa' trong thanh điều hướng và chú ý cách điều hướng và xem hoạt ảnh và bao gồm thanh điều hướng, thanh tab và chế độ xem hiện có.

Tôi có thể thấy một phân đoạn phương thức trong ứng dụng nhóm facebook, vốn là phản ứng gốc từ sự hiểu biết của tôi. Nhấp vào tab 'Nhóm', nhấp vào nút 'tạo' thanh điều hướng.

Có ai biết cách triển khai phân đoạn phương thức gốc trong phản ứng gốc không?

+0

[bắt đầu từ v0.10 có một phần phương thức] (https: // github .com/facebook/reaction-native/blob/master/Ví dụ/UIExplorer/ModalExample.js) – syg

+0

@syg các tài liệu nói rằng đó là để trộn RN và các phần gốc của một ứng dụng. –

Trả lời

3

Tôi làm việc trên thành phần Bộ điều hướng gốc phản ứng.

Để thực hiện việc này, bạn có thể đặt Bộ điều hướng trong cảnh của một Bộ điều hướng khác. Trình điều hướng bên ngoài định cấu hình cảnh của nó với Navigator.SceneConfigs.FloatFromBottom hoặc một cái gì đó tương tự. Bên trong cảnh, bạn có thể có một <Navigator> với navigationBar={<Navigator.NavigationBar ...etc />}

+1

bạn có thể cụ thể hơn một chút ở đây không? Kinda khó để làm theo điều này và nó có vẻ giống như một yêu cầu cơ bản mà dường như không được tài liệu rõ ràng bất cứ nơi nào. –

+0

đã tự tìm ra chính mình –

+0

Xin lỗi nếu tài liệu bị thiếu thốn ngay bây giờ. Tôi đã tập trung vào việc ổn định API và các tính năng xây dựng cho các ứng dụng Android. Nếu bạn muốn giúp làm rõ tài liệu cho người khác, vui lòng gửi PR: https://github.com/facebook/react-native/blob/master/Libraries/CustomComponents/Navigator/Navigator.js –

4

enter image description here

this.props.navigator.push({ 
    title: 'Pick Date', 
    sceneConfig: Navigator.SceneConfigs.FloatFromBottom, 
    component: DatePickerView, 
    navigationBar: <NavigationBar 
     title="Initial View"/>, 
    passProps: {handleSelectedDate: this.handleSelectedDate} 
}) 

Liên kết với nguồn là ở đây: https://github.com/aaronksaunders/React-Modal-Nav-Example

+0

Đấu tranh với điều này là tốt. Bạn có một ví dụ hoàn chỉnh ở đâu đó không? – Rory

+0

Tôi đăng một ví dụ hoàn chỉnh hơn ở đây cho một cách tiếp cận bằng cách sử dụng một mô-đun. aaronksaunders/React-Modal-Nav-Ví dụ http://bit.ly/1JCRE6y –

Các vấn đề liên quan