@interactify-live/player-react-native
Version:
React Native library for Interactify player with media display, widgets, and MQTT integration
57 lines (56 loc) • 2.08 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_native_1 = require("react-native");
const index_1 = require("./index");
const TestComponent = () => {
const testInteractions = [
{
interaction: 'text',
geometric: {
x: 50,
y: 50,
width: 200,
height: 50,
},
payload: {
text: 'Test Widget',
size: 18,
color: '#ffffff',
background: 'rgba(0,0,0,0.8)',
borderRadius: 8,
},
},
];
return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: styles.container, children: [(0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.title, children: "MediaWidgets Test" }), (0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles.playerContainer, children: (0, jsx_runtime_1.jsx)(index_1.InteractionRenderer, { interactions: testInteractions, style: styles.player, isDraggable: true, onInteractionPress: interaction => console.log('Interaction pressed:', interaction), onInteractionDragEnd: (index, position) => console.log('Widget moved:', index, position) }) }), (0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.statusText, children: "\u2705 MediaWidgets library loaded successfully" })] }));
};
const styles = react_native_1.StyleSheet.create({
container: {
flex: 1,
padding: 20,
backgroundColor: '#f5f5f5',
},
title: {
fontSize: 20,
fontWeight: 'bold',
textAlign: 'center',
marginBottom: 20,
},
playerContainer: {
alignItems: 'center',
marginBottom: 20,
},
player: {
width: 300,
height: 200,
backgroundColor: '#2c3e50',
borderRadius: 8,
overflow: 'hidden',
},
statusText: {
textAlign: 'center',
color: '#27ae60',
fontWeight: 'bold',
},
});
exports.default = TestComponent;