vuminh224/mmm-projet
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

addChanter, selectChefChantier, en cour + Update de themed-button pour prendre en charge le changement de theme pendant la pression

Browse Source
This commit is contained in:
Rochas
2025-12-12 21:57:09 +01:00
parent 8ba664c2ad
commit e95bb3fd70
6 changed files with 309 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
components/theme/themed-button.tsx
View File

@@ -6,23 +6,32 @@ export type ThemedPressableProps = PressableProps & {
lightColor?: string;
darkColor?: string;
lvl?:number;
lvlPressed?:number;
border?:number;
opacity?:string;
shadow?: boolean;
};
//nb : pour border ne pas oublier de mettre en plus "borderWidth" dans le style du composant /!\
export function ThemedButton({ style, lightColor, darkColor,lvl=1,border=-1,opacity="FF",shadow=false, ...otherProps }: ThemedPressableProps) {
export function ThemedButton({ style, lightColor, darkColor,lvl=1,lvlPressed=1,border=-1,opacity="FF",shadow=false, ...otherProps }: ThemedPressableProps) {
var lvlStr:string = "background";
var lvlStrPressed:string = "background";
var borderColor ="";
var borderWidth = 0;
if(lvl>=0 && lvl<6){
lvlStr+=lvl;
}
else lvlStr+='5';
if((lvl+lvlPressed)>=0 && (lvl+lvlPressed)<6){
lvlStrPressed+=(lvl+lvlPressed);
}
else lvlStrPressed+='0';
const backgroundColor = useThemeColor({ light: lightColor, dark: darkColor },lvlStr as 'background0'|'background1'|'background2'|'background3'|'background4'|'background5')+opacity;
const backgroundPressed = useThemeColor({ light: lightColor, dark: darkColor },lvlStrPressed as 'background0'|'background1'|'background2'|'background3'|'background4'|'background5')+opacity;
if(border!=-1){
var borderStr = "";
@@ -46,5 +55,9 @@ export function ThemedButton({ style, lightColor, darkColor,lvl=1,border=-1,opac
shadowRadius: 6,
}
return <Pressable style={(state) =>[{ backgroundColor, borderColor, borderWidth }, shadow && shadowStyle, typeof style === 'function' ? style(state) : style,]} {...otherProps}/>;
return <Pressable style={(state) =>[{
backgroundColor: state.pressed ? backgroundPressed: backgroundColor,
borderColor,
borderWidth
}, shadow && shadowStyle, typeof style === 'function' ? style(state) : style,]} {...otherProps}/>;
}